1

刚刚更改为Angular 1.2.0-rc.3 （从 1.2.0-rc.2）并且内联编辑器的指令不再起作用。

在正常模式下工作正常但不是内联。

有谁知道如何解决这个问题？

谢谢。

app.directive('uiCkeditor', [function() {
        return {
            require: '?ngModel',
            link: function(scope, element, attrs, ngModel) {
                if (!ngModel)
                    return; 

                ngModel.$render = function(value) {
                    ck.setData(ngModel.$viewValue);
                }

                 // var ck = CKEDITOR.replace(element[0]);
                 var ck = CKEDITOR.inline(element[0])

                ck.on('pasteState', function() {
                    ngModel.$setViewValue(ck.getData());
                    scope.$apply();
                });

            }
        }
    }])
4

1 回答 1

1

我使用 ng-bind-html 来渲染模型中的内容，并创建了指令 ck-inline 来添加内联功能并将模型绑定到内联编辑器中发生的更改。该指令需要 ng-bind-html 才能工作，并且您还需要将 ngSanitize 添加到您的模块中。将指令 ck-inline 添加到您的元素中，它应该可以正常工作。

我建议您对常规编辑器使用不同的指令，因为它具有不同的行为，并且仅使用 ng-model 指令就可以很好地工作。

我也使用 $timeout ，因为我注意到如果我不渲染文本，然后 ckeditor 会以某种方式删除所有弄乱模型的值（这不会发生在非内联选项中）。这是代码。

yourModule.directive('ckInline', ['$sce', '$timeout', function($sce, $timeout){
    return{
        require : '?ngBindHtml',
        scope:{value:"=ngBindHtml"},
        link : function(scope, elm, attr, ngBindHtml)
        {
            $timeout(function()
            {
                var ck_inline;
                elm.attr("contenteditable", "true");
                CKEDITOR.disableAutoInline = true;
                ck_inline = CKEDITOR.inline(elm[0]);

                if (!attr.ngBindHtml)
                    return;

                ck_inline.on('instanceReady', function()
                {
                    ck_inline.setData(elm.html());
                });

                function updateHtml()
                {
                    scope.$apply(function()
                    {
                        scope.value = $sce.trustAsHtml(ck_inline.getData());
                    });
                }


                ck_inline.on('blur', updateHtml);
                ck_inline.on('dataReady', updateHtml);

            }); 
        }
    };
}]);
于 2014-05-11T05:28:17.480 回答