Я создаю пользовательскую директиву AngularJS, которая обертывает редактор tinymce 4. Проблема возникает, когда я пытаюсь удалить редактор tinymce из набора других редакторов tinymce. Пожалуйста, посмотрите демонстрацию. Вот попробуйте удалить первый или второй редактор, а следующие редакторы ломаются.
JS:
var app = angular.module('myApp', []);
app.controller('MainCtrl', function($scope) {
$scope.editors = [{}, {}, {}];
$scope.removeEditorByIndex = function (index) {
$scope.editors.splice(index, 1);
};
});
app.directive('myEditor', function () {
var uniqueId = 0;
return {
restrict: 'E',
require: 'ngModel',
scope: true,
template: '<textarea></textarea>',
link: function (scope, element, attrs, ngModel) {
var id = 'myEditor_' + uniqueId++;
element.find('textarea').attr('id', id);
tinymce.init({
selector: '#' + id
});
//where in AngularJS should I place the following lines?
//tinyMCE.execCommand('mceRemoveEditor', false, id);
//tinyMCE.execCommand('mceAddEditor', false, id);
}
}
});
HTML:
<div ng-app="myApp">
<div ng-controller="MainCtrl">
Try removing the first editor. You will see that next editors become unusable.
<div ng-repeat="editor in editors">
<button ng-click="removeEditorByIndex($index)">Remove editor #{{$index + 1}}</button>
<my-editor ng-model="text"></my-editor>
</div>
</div>
</div>
Причина этого в том, что после удаления элемента из $scope.editors
angular удаляет каждый последующий редактор и снова добавляет его на место удаленного редактора (внутренне angular вызывает jQuery .after()
). А также
В некоторых браузерах невозможно сохранить содержимое iframe, поскольку после удаления узла из dom документ/окно выгружается.
(взято из здесь).
Чтобы исправить сломанный редактор, я должен позвонить:
tinyMCE.execCommand('mceRemoveEditor', false, id);
tinyMCE.execCommand('mceAddEditor', false, id);
(достаточно вызвать эти две строки одну за другой)
Где я должен поместить эти строки повторной инициализации? Каков правильный угловатый способ вызова этих строк?
Н.Б. Я также могу переключиться на встроенный режим редактора tinymce, который не зависит от iframe. Но это принесет большое неудобство: стили из редактора будут пересекаться со стилями со страницы. Поэтому этот вариант неприемлем.
id
. - person rGil   schedule 10.07.2013tinyMCE.editors[id].execCommand('mceRemoveEditor', false, id);
- person Christoffer Bubach   schedule 12.07.2013tinyMCE.editors[id].execCommand('mceRemoveEditor', false, id);
лучше работает в FF? - person Raman Chodźka   schedule 12.07.2013