Angular：document.execCommand 添加的 <ol> 在 styles.css 中仅看到 css 规则，但在组件的 css 中看不到

Question

我正在 angular 中创建富文本编辑器，当我执行 document.execCommand('insertOrderedList') 时，我得到 <ol> 项目，它不受我组件的 css 的影响，只有 css in styles.css（项目根目录中的主要 css 文件）影响我使用 document.execCommand 添加的项目。是否可以更改此行为？

Answer 1

当然可以。它的名称是 view encapsulation。将其更改为 ViewEncapsulation.none 将产生所需的行为。

@Component({
  ...
  encapsulation: ViewEncapsulation.none
})

Angular：document.execCommand 添加的 <ol> 在 styles.css 中仅看到 css 规则，但在组件的 css 中看不到

Angular: <ol> added by document.execCommand sees only css rules in styles.css but not in the component's css

html

css

html-lists

execcommand

angular