Я использовал Vojta's angularJS directive, но иногда ckeditor не смог отобразить данные из службы. Это почти никогда не происходило при обновлении, но часто случалось при навигации по странице. Я смог проверить, что функция $ render всегда вызывала ck.setData с правильными данными, но иногда она не отображалась.Директива angularjs ckeditor иногда не может загрузить данные из службы
11
A
ответ
11
Похоже, что метод $ render иногда вызывался до того, как ckeditor был готов. Я смог разрешить это, добавив слушателя к событию instanceReady, чтобы убедиться, что он был вызван хотя бы один раз после того, как ckeditor был готов.
ck.on('instanceReady', function() {
ck.setData(ngModel.$viewValue);
});
В интересах полноты, вот полная директива, которую я использовал.
//Directive to work with the ckeditor
//See http://stackoverflow.com/questions/11997246/bind-ckeditor-value-to-model-text-in-angularjs-and-rails
app.directive('ckEditor', function() {
return {
require: '?ngModel',
link: function(scope, elm, attr, ngModel) {
var ck = CKEDITOR.replace(elm[0],
{
toolbar_Full:
[
{ name: 'document', items : [] },
{ name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
{ name: 'editing', items : [ 'Find','Replace','-','SpellChecker', 'Scayt' ] },
{ name: 'forms', items : [] },
{ name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript' ] },
{ name: 'paragraph', items : [
'NumberedList','BulletedList','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock' ] },
{ name: 'links', items : [] },
{ name: 'insert', items : [ 'SpecialChar' ] },
'/',
{ name: 'styles', items : [ 'Styles','Format','Font','FontSize' ] },
{ name: 'colors', items : [] },
{ name: 'tools', items : [ 'Maximize' ] }
]
,
height: '290px',
width: '99%'
}
);
if (!ngModel) return;
//loaded didn't seem to work, but instanceReady did
//I added this because sometimes $render would call setData before the ckeditor was ready
ck.on('instanceReady', function() {
ck.setData(ngModel.$viewValue);
});
ck.on('pasteState', function() {
scope.$apply(function() {
ngModel.$setViewValue(ck.getData());
});
});
ngModel.$render = function(value) {
ck.setData(ngModel.$viewValue);
};
}
};
});
3
function updateModel() {
scope.$apply(function() {
if (ck.getData().length) {
ngModel.$setViewValue(ck.getData());
}
});
}
см полный код:
return {
require: '?ngModel',
scope: true,
link: function (scope, element, attr, ngModel) {
if (!ngModel) return;
var ck = CKEDITOR.replace(element[0]);
ck.on('instanceReady', function() {
ck.setData(ngModel.$viewValue);
});
function updateModel() {
scope.$apply(function() {
if (ck.getData().length) {
ngModel.$setViewValue(ck.getData());
}
});
}
ck.on('pasteState', updateModel);
ck.on('change', updateModel);
ck.on('key', updateModel);
ck.on('dataReady', updateModel);
ngModel.$render = function() {
ck.setData(ngModel.$modelValue);
};
}
}
0
Я также решить эту проблему И когда я нашел новую директиву. Это хорошо работает для меня !!!
Пожалуйста, попробуйте следующее:
return {
require: '?ngModel',
scope: true,
link: function (scope, element, attr, ngModel) {
if (!ngModel) return;
var ck = CKEDITOR.replace(element[0]);
ck.on('instanceReady', function() {
ck.setData(ngModel.$viewValue);
});
function updateModel() {
scope.$apply(function() {
if (ck.getData().length) {
ngModel.$setViewValue(ck.getData());
}
});
}
ck.on('pasteState', updateModel);
ck.on('change', updateModel);
ck.on('key', updateModel);
ck.on('dataReady', updateModel);
ngModel.$render = function() {
ck.setData(ngModel.$modelValue);
};
}
};
Смежные вопросы
- 1. AngularJS Загрузить данные из службы
- 2. директива AngularJS иногда не называется
- 3. Angularjs не может получить данные из службы
- 4. AngularJS директива и вытягивание данных из службы
- 5. AngularJS Данные из службы
- 6. AngularJS Контроллер не может загрузить данные
- 7. Угловая директива Ckeditor не работает
- 8. Директива и данные службы API
- 9. Выражение AngularJS, не отображающее данные из службы
- 10. Директива AngularJS, не считывающая данные с контроллера
- 11. Угловая директива не подбирая данные службы
- 12. Загрузить данные из веб-службы с помощью AngularJS
- 13. AngularJS Директива Countup.JS получить данные из модели
- 14. CKEditor render угловая пользовательская директива
- 15. AngularJS: Директива не может найти зависимость впрыскивается
- 16. AngularJs директива наблюдает async данные
- 17. AngularJS листовка Heatmap директива не обновляет данные
- 18. AngularJS директива загрузки, прежде чем данные
- 19. AngularJS + CKEditor, размытость событие
- 20. .NET иногда не может загрузить DLL
- 21. ClassLoader иногда не может загрузить ресурс
- 22. php ckeditor не может установить данные php
- 23. Директива Angularjs - не может извлечь значение из изолированной области
- 24. Директива AngularJs не вставляет
- 25. директива не работает angularjs
- 26. Тяговое данные AngularJS службы
- 27. НЕ МОЖЕТ ПРОЧИТАТЬ ДАННЫЕ CKEDITOR PHP MYSQL
- 28. Угловая директива не вызывается из службы?
- 29. Иногда данные не загружаются в CKeditor в угловом
- 30. AngularJS директива не работает
Разве это решение продолжало работать на вашем сайте? Я попытался заставить это работать несколькими способами (в том числе и вашими), и все равно содержимое будет неактивно загружаться. – keepitreal