TinyMCE 更新 content_style答案

【问题标题】：TinyMCE update content_styleTinyMCE 更新 content_style
【发布时间】：2019-02-13 14:39:51
【问题描述】：

我正在使用 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;}";

但是，此更改并未应用。每次我想更改内容 css 时，是否需要以某种方式重新初始化编辑器？

【问题讨论】：

【解决方案1】：

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

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

使用我们提供的 Angular，您可能需要重新加载包含 TinyMCE 的组件才能执行删除/初始化循环。

【讨论】：

【解决方案2】：

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

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

【讨论】：