Search code examples
javascriptangularjsangularjs-directivewysiwygcontenteditable

Is there any way to use colorPicker in Angular WYSIWYG directive without using jQuery

When I remove the jquery refrence color picker is not working in WYSIWYG directive and in my project I should not use jQuery so is there any way to do this without using jquery? Or is there any other editor which has no jquery refrence?plunker with jquery ref

Solution

  • demo : http://so.lucafilosofi.com/is-there-any-way-to-use-colorpicker-in-angular-wysiwyg-directive-without-using-j/

    The problem you have actually is not with colorPicker but with the wysiwyg module itself as stated in it's code comments:

    Requires: Twitter-bootstrap, fontawesome, jquery, angularjs, bootstrap-color-picker

    anyway, fortunately that module is using jquery only for bootstrap and tooltip plugin...

    so i have:

    • replaced the original bootstrap with UI Bootstrap for angularjs
    • added ngSanitize module that provides functionality to sanitize HTML.
    • hacked the wysiwyg module to use the uib-tooltip directive
    • created a new ad-hoc directive for the contenteditable div
    • source plunker

    hope this help. ;-)