Как настроить tinymceOptions из angular-ui/ui-tinymce

предполагая, что у вас есть угловое приложение, и это просто вопрос настройки редактора, вы можете настроить редактор с теми же параметрами, которые задокументированы для неуглового, базового TinyMce здесь:http://www.tinymce.com/wiki.php/configuration

если вы нажмете на определенную опцию, вы увидите, как вы можете настроить неугловую tinymce так:

tinymce.init({
    resize: false
});

поэтому, чтобы сделать эквивалентную настройку в angular с помощью ui-tinymce, вместо этого из в TinyMCE.init (), вы бы установили параметры внутри переменной области $scope.tinymceOptions. Таким образом, пример настройки ui-tinymce, чтобы не позволять пользователю изменять размер, иметь ширину / высоту 400/300, разрешать печать и выбор цвета/фона текста:

myAppModule.controller('MyController', function($scope) {
    $scope.tinymceOptions = {
        resize: false,
        width: 400,  // I *think* its a number and not '400' string
        height: 300,
        plugins: 'print textcolor',
        toolbar: "undo redo styleselect bold italic print forecolor backcolor"

    };
});

и ваш взгляд может выглядеть примерно так (Обратите внимание на tinymceOptions):

  <textarea ui-tinymce="tinymceOptions" ng-model="tinymceModel"></textarea>

ui-tinymce должен поставляться с рядом встроенных плагинов, которые вы можете найти здесь: http://www.tinymce.com/wiki.php/Plugins

полный список параметров панелей инструментов см.: http://www.tinymce.com/wiki.php/Controls

насколько я помню, вы не можете постфактум изменить tinymceOptions. Под этим я подразумеваю, что после загрузки редактора, Если вы хотите позже изменить некоторые из $scope.tinymceOptions, эти изменения не будут автоматически обновляться в Редакторе, потому что я считаю, что код ui-tinymce передает параметры в TinyMCE.init () только один раз при загрузке.

вы также можете делать такие вещи, как вручную установить содержимое редактора, используя простые крючки javascript TinyMCE, такие как:

tinyMCE.activeEditor.setContent('<h1>hello world</h1><p>this is my story.  the end.</p>');

аналогично, вы можете использовать getContent () см.:http://www.tinymce.com/wiki.php/API3:method.tinymce.Editor.getContent Но я считаю, что вы также можете получить доступ к содержимому редактора через $scope.переменная tinymceModel в этом примере. (случай использования, если у вас есть ng-нажмите на кнопку, чтобы сохраните содержимое редактора, а затем как вы получите содержимое редактора...)

но более угловым способом было бы сделать все через переменные ng-model и scope вместо того, чтобы полагаться на raw TinyMCE javascript api.

надеюсь, что это поможет. В общем, ui-tinymce-очень тонкая оболочка вокруг простого TinyMce. Так что все, что вы можете сделать с обычным tinymce, вы можете по большей части сделать с угловой версией. Я думаю, именно поэтому не так много документов для настройки ui-tinymce, но этот факт не является очевидным для новых новичков.