Angular:为什么我应该使用 'encapsulation: ViewEncapsulation.Native' ？

Question

在 Angular 中，默认模式是 封装:ViewEncapsulation.Emulated

此模式通过使用 CSS 选择器启用样式封装。然而，'encapsulation: ViewEncapsulation.Native' 也实现了样式封装，但使用了另一种技术，shadow DOM。虽然技术不同，但结果是一样的。

如果是这样，我为什么要使用“ViewEncapsulation.Native”？在“ViewEncapsulation.Emulated”中没有得到的这种模式下我得到了什么？

Answer 1

通过“原生”封装，您可以获得新的 Shadow DOM 规范提供的所有功能。

This blog article解释了 Angular2 中不同模式之间的差异。

因为 Emulated 模仿了 Native 模式，您将获得所有可以模拟的功能。

无法模拟的是真正的 CSS 封装(带有 !important 指令的规则可以应用于您的模拟组件)和作用域选择(借助于querySelector()).

使用 native 模式，渲染应该更快(因为它是...... native !)。