Как получить экземпляры ckeditor с помощью ng-repeat?
Я пытаюсь использовать ckeditor с angularjs. Для этого я добавил директиву. Он работает нормально. Проблема в том, что когда я пытаюсь получить список экземпляров ckeditor.
// директива
app.directive('ckeditor', function () {
return {
require: '?ngModel',
link: function (scope, element, attr, ngModel) {
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);
};
}
};
});
// ng-повтор
<div ng-repeat = "key in []| range:0:(vm.listCount-1)">
<textarea ckeditor id = "content_{{key + 1}}"
ng-model = "vm.contentList[key].content">
</textarea>
</div>
В контроллере я пытаюсь получить список экземпляров. Там вместо content_0,content_1 и т. д. Я получаю content_{{key + 1}} только один экземпляр
console.info(CKEDITOR.instances);
Я хочу получить правильный экземпляр ckeditor, но я получаю только одно значение: content_{{key + 1}} Пожалуйста, подскажите.
vm.contentList изначально пуст в зависимости от диапазона, в который он будет добавлять значения динамически. Сообщение об ошибке отсутствует. Фильтр диапазона основан на раскрывающемся списке, где будет доступен счет, например: 1, 2, 3.
меня беспокоит то, что вместо content_0,content_1 он будет регистрировать идентификатор экземпляра как content_{{key + 1}}
Ответы 1
Я предполагаю, что директива должна установить атрибут id перед вызовом CKEDITOR.replace:
app.directive('ckeditor', function () {
return {
require: '?ngModel',
link: function (scope, element, attr, ngModel) {
//COMPUTE id attribute
if (attr.key) {
var keyValue = scope.$eval(attr.key);
element[0].id += "_"+keyValue;
};
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);
};
}
};
});
Применение:
<div ng-repeat = "key in [0,1]">
<textarea ckeditor key = "$index+1" id = "content"
ng-model = "vm.contentList[key].content">
</textarea>
</div>
CKEDITOR, скорее всего, создает экземпляр редактора до того, как платформа AngularJS вычислит id = "content_{{key + 1}}".
Если я console.info(attr.id); он показывает правильное значение, но в контроллере console.info(CKEDITOR.instances); это не показывает мне то же самое.
Я также думаю, что до того, как Angular js вычислит, запускается ckeditor. Есть ли способ решить эту проблему?
attr.id не то же самое, что element[0].id.
после элемента console.info [0].id -- content_{{key + 1}} это то, что он печатает в консоли
Это работает. Если я буду следовать примеру, которым вы поделились, спасибо
Работает с
ng-repeat = "key in [0,1]"? Как инициализируется контроллерvm.contentList? Какой код у фильтраrange? Какие сообщения об ошибках вы получаете в консоли разработчика?