TinyMCE 更新 content_style

Question

我正在使用 TinyMCE 4 的 Angular 包装器，使用一些自定义 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

加载编辑器后，您不能动态加载不同的 CSS - 一旦 TinyMCE 处理配置，它就不会重新检查这些变量。

当然可以使用remove()和init()重新初始化TinyMCE。

我们为您提供 Angular，您可能需要重新加载包含 TinyMCE 的组件才能使 remove/init 循环发生。

Answer 2

因为我不想重新初始化整个编辑器，所以我继续手动更新样式标签。当然你应该确保你更新的是正确的，这里是一个简化版本：

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

TinyMCE update content_style