javascript - How to add CKEditor instances inside Controller scopes with AngularJS and CKEditor -
he there all,
lately ve been experimenting angular js. goes nice, controllers, services etc.
when try make div editable inside ng-controller ckeditor toolbar not popup. other div outside controller works fine.
html:
<!-- begin dynamic content angularjs -->     <div id="js_enabled" class="js_enabled" ng-controller="boxes_controller">         <div class="box" ng-repeat="box in boxes" style="min-width: {[{ boxes_width }]}%; width:  {[{ boxes_width }]}%; max-width: {[{ boxes_width }]}%;">             <p contenteditable="true"> asd</p>             <div class='box-content'>                     <p>                     <b>{[{ box.title }]}</b><br/>                     {[{ box.description }]}                     </p>             </div>         </div>     </div> <!-- end dynamic content angularjs -->   the {[{}]} interpolation override. if can see there small 'p' element contenteditable testing. element not show ckeditor bar. tested it's not css. toolbar div elements ckeditor not created , no errors exist.
ps. if make other element editable outside controller scope, works well.
made easy directive.
just load ckeditor.js , code is:
mainapp.directive('ckeditor', function() {     return {         restrict: 'a', // activate on element attribute         scope: false,         require: 'ngmodel',         controller: function($scope, $element, $attrs) {}, //open         link: function($scope, element, attr, ngmodel, ngmodelctrl) {             if(!ngmodel) return; // nothing if no ng-model might want remove             element.bind('click', function(){                 for(name in ckeditor.instances)                     ckeditor.instances[name].destroy();                 ckeditor.replace(element[0]);             });         }     } });   supports multiple instances
Comments
Post a Comment