TinyMCE обновление content_style

Question

Я использую Angular-обертку для TinyMCE 4, инициализируя редактор с помощью некоторого пользовательского CSS, например:

editorInit: Settings = {
  menubar: false,
  statusbar: false,
  toolbar: false,
  content_style: '.highlight {background-color: #fff877;}'
};

Я хотел бы динамически изменить этот content_style позже, например, так:

editor.settings.content_style = ".highlight {background-color: none;}";

Однако это изменение не применяется.Нужно ли заново инициализировать edior каждый раз, когда я хочу изменить содержимое css?

Answer 1

Так как я не хочу повторно инициализировать весь редактор, я пошел дальше и обновил тег стиля вручную.Конечно, вы должны убедиться, что вы обновляете правильную версию, вот упрощенная версия:

editor.iframeElement.contentDocument.getElementsByTagName('style')[1].innerHTML = `
  .highlight {
    background: none;
  }`;

Answer 2

Как только редактор загружен, вы не можете динамически загружать другой CSS - как только TinyMCE обработает конфигурацию, он не будет повторно проверять эти переменные.

Вы, конечно, можете использовать remove() и init(), чтобы повторноинициализируйте TinyMCE.

С помощью Angular мы предоставляем вам, вероятно, необходимость перезагрузить компонент, включающий TinyMCE, чтобы выполнить цикл удаления / инициализации.