Callback not working

[ankitjs]

Hi, Thanks for such great component, I have tried to call function on content changed as mentuioned in docs "on-content-changed="myCallback(editor, html, text)" and in my Controller is $scope.myCallback = function(x,y,z){ ... }. another thing can you share fiddle/plunker for ng-quill vaidation (required) inside form. Thanks

[KillerCodeMonkey]

You can simply take a look at my demo page: https://github.com/KillerCodeMonkey/ng-quill/blob/develop/demo.html

and the live preview: http://killercodemonkey.github.io/ng-quill/demo.html

There is also an example with the contentChanged callback --> which is working. open the demo and open JS-Console --> Type something in the first editor.

[KillerCodeMonkey]

any updates?

[KillerCodeMonkey]

close due to inactivity of issue creator

[ankitjs]

Hi, Thanks for your response and sorry I was busy on some other issue,couldn't revert back. I checked your example : [https://github.com/KillerCodeMonkey/ng-quill/blob/develop/demo.html], but no luck, here are screen shots (a) template

(b) controller

(c) output

even I tried your example, but no luck.

thanks

[KillerCodeMonkey]

you are registering two on-content-changed callbacks.

And the visibility of the scope is correct?

[ankitjs]

"you are registering two on-content-changed callbacks." I was checking, even tried with 'on-content-changed', but no luck. "visibility of the scope is correct", yes

[KillerCodeMonkey]

could you give me access to you project? then i will take a deeper look at it.

I added testcases in the last days to this project and the callbacks are working there as expected, too.

thank

[jziggas]

I seem to be in a similar situation. on-editor-created is not working but on-content-changed is working. It's very confusing. Still troubleshooting - will report back if I find anything.

[jziggas]

So I'm actually wrapping ng-quill with my own directive, and I'm wondering if this is why I'm not seeing my scope when this.editorCreated is called from within ng-quill:

$postLink() - Called after this controller's element and its children have been linked. Similar to the post-link function this hook can be used to set up DOM event handlers and do direct DOM manipulation. Note that child elements that contain templateUrl directives will not have been compiled and linked since they are waiting for their template to load asynchronously and their own compilation and linking has been suspended until that occurs.

[jziggas]

Found the issue but no idea why it's occuring: this.editorCreated is called before the linking function of my directive is called.

I turned my templateUrl into a template to avoid the potential $postLink issue referenced above.

Forcing my template to compile first before rendering ng-quill like this:

link: function(scope, element, ...) {
    let template = '...'
    element.html(template).show();
    $compile(element.contents())(scope);
}

gets this.editorCreated to fire correctly but that seems kludgy as hell.

[KillerCodeMonkey]

Could you show me your code?

[jziggas]

Perhaps privately in a gist. We've moved onto ckeditor now, but I'll checkout the old branch when I get a chance and hit you up via email.

[KillerCodeMonkey]

thanks for the response. i keep this issue closed. But feel free to email me.

[mindscratch]

@KillerCodeMonkey did you get any info from @jziggas? I'm believe I'm experiencing a similar issue with ng-quill wrapped in a component.

[mindscratch]

Using angular 1.5.x, In my components controller this works:

$scope.$on("editorCreated", function (event, editor) { ctrl.editor = editor; });

[jziggas]

Hi, I'm back to using ng-quill and have it wrapped in component. That scope listener is confusing if you're using a component. My wrapper looks something like this:

angular.module('app').component('ngQuillWrapper', {
    controllerAs: 'vm',
    bindings: {
        content: '=',
        onContentChanged: '&?',
        onEditorCreated: '&?',
        onSelectionChanged: '&?',
        ...
    },
    ...
    controller: function ngQuillWrapper($element, $scope, ..., ...) {
        let vm = this;
        let editor;
        vm.editorCreated = editorCreated(_editor) {
            editor = _editor;
            ...
            if (vm.onEditorCreated) {
                vm.onEditorCreated({editor: editor});
            }
            ...
        }
    }
});

<ng-quill-editor
    modules="vm.modules"
    ng-model="vm.content"
    on-editor-created="vm.editorCreated(editor)"
    on-content-changed="vm.contentChanged(editor, html, text, delta, oldDelta, source)"
    on-selection-changed="vm.selectionChanged(editor, range, oldRange, source)"
    toolbar="true"
    ...
>
...