Search code examples
javascriptangularjsimagesummernote

Angularjs summernote: $scope.editor.insertImage is not a function


I want to upload an image to the server and place it as an image inside my text.

Editor:

<summernote ng-model="answer.value" id="answerValue" config="options" on-image-upload="imageUpload(files)" editable="editable" editor="editor"></summernote>

JS Code:

$scope.options = {
   height: 400
};
$scope.imageUpload = function(files) {
    answer.uploadImage(files[0]).then(function(result) {
        console.log('image upload\'s editor:', $scope.editor);
        console.log('image upload\'s editable:', $scope.editable);
        $scope.editor.insertImage($scope.editable, result.data.url);
    }, function(result) {

    });
};

Libraries:

<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/summernote/dist/summernote.min.js"></script>
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-summernote/dist/angular-summernote.min.js"></script>

$scope.editor and $scope.editable are defined, but it says:

$scope.editor.insertImage is not a function

Does anyone know what I am doing wrong?


Solution

  • Change the code

    $scope.editor.insertImage($scope.editable, result.data.url);
    

    to

    $scope.editor.summernote('insertImage', result.data.url, 'filename');
    

    it works in summernote 0.7.0 with angular-summernote