Question

我有插入wiris的ckeditor，并且我有ng-repeate的ck-editors实例，当用户在ck-editor的任何实例发布任何wiris问题时，该帖子被发布到ck-editor的第一个实例.I想要ng-repeat中的ck-editors的3个实例，用户用wiris方程发布ck-editor的第2个实例然后那个帖子应该只显示在ck-editor的第2个实例，目前它只显示在第1个实例。 我的HTML ：

       <div ng-repeat="item in items"> 
<form role="form" name="DiscussionForm" novalidate>
            <input type="text" name="followup" ng-model="followupDis"  
    ck-editor placeholder="Compose" required>
            <div><button type="submit"ng-click="start()">Post</button>
            </div>
       </form>
</div>

在 js

中

    app.directive('ckEditor', function() {
        return {
            require: '?ngModel',
            link: function(scope, elm, attr, ngModel) {
                var ck = CKEDITOR.replace(elm[0]);

                if (!ngModel) return;

                ck.on('instanceReady', function() {
                    ck.setData(ngModel.$viewValue);
                });

                function updateModel() {
                    scope.$apply(function() {
                        ngModel.$setViewValue(ck.getData());
                    }); 
                }

                ck.on('change', updateModel);
                ck.on('focus', updateModel);
                ck.on('key', updateModel);
                ck.on('dataReady', updateModel);

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

我期望在指令中为第一个元素var ck = CKEDITOR.replace(elm[0]);创建实例，因此它应该更改。因此，任何人都可以与wiris共享多个ckeditor实例的解决方案。

Answer 1

我发现通过更改属性的id我们可以解决这个问题。

在js：

app.directive('ckEditor', function() {
        var counter = 0, prefix = "followupDiscussionPostReply-";
        return {
            require: '?ngModel',
            link: function(scope, elm, attr, ngModel) {

                if (!attr.id) {
                    attr.$set('id', prefix + (++counter));
                }
               // rest of the code

这些更改修复了多个ckeditors对我有相同的ngModel问题。

Angularjs多个ckEditors具有相同的ngModel

1 个答案: