Ckeditor角度指令不起作用

Question

I use below code to show ckeditor using angularjs directive . but it doesn't show in th page .

directive :

'use strict';
define('ngCkeditor', ['app'], function (app) {
app.directive('ngCkeditor', function () {
    return {
        restrict: 'AC',
        require: 'ngModel',
        link: function (scope, element, attr, ngModel) {

            debugger;
            var ck = CKEDITOR.replace(element[0]);
            if (!ngModel) return;
            ck.on('pasteState', function () {
                scope.$apply(function () {
                    ngModel.$setViewValue(ck.getData());
                });
            });
            ngModel.$render = function (value) {
                ck.setData(ngModel.$viewValue);
            };

        }
    };
});
});

and the Controller :

define('ckEditorController', ['app', 'ckeditor', 'ckfinder', 'ngCkeditor'], function (app, ckeditor, ckfinder, ngCkeditor) {
app.lazy.controller('ckEditorController', ['$scope', '$location', function ($scope, $location) {

    debugger;
        $scope.text = 'this is test';

}]);
});

and this is the Html :

<link href="~/app/lib/editor/css/bootstrap.css" rel="stylesheet" />
<link href="~/app/lib/editor/ng-ckeditor.css" rel="stylesheet" />
<h2>CkEditor</h2>
<form name="frm">
<div ng-controller="ckEditorController">
    <textarea class="ng-Ckeditor" ng-model="text"></textarea>
    <textarea ng-ckeditor ng-model="text"></textarea>
    <h3>Result HTML:</h3>
    <div ng-bind-html-unsafe="text"></div>
</div>

it seems to me the link part in directive doesn't fire .

thanks

update :

look at jsfiddle link . It works like a charm . but mine doesn't

Answer 1

You should use correct directive name:

<textarea ng-ckeditor ng-model="text"></textarea>

Note that ‛ngCkeditor‛ directive name corresponds to ‛ng-ckeditor‛ normalized form, due to camelCase to snake-case conversion.

Check this answer where I provided detailed explanation. https://stackoverflow.com/a/33460305/949476