angular - 为每个组件设置 ViewEncapsulation.None

我不喜欢 Angular 在 HTML 页面的元素中添加 _ngcontent-*，因为我并没有真正使用这个功能，所以我通过在组件中添加 encapsulation: ViewEncapsulation.None 来移除它。但由于项目中有很多组件，而且将来还会有更多，我想知道是否有一种方法可以全局设置封装，而不是修改每个组件。

这是我做的一些研究以及关于 ViewEncapsulation 枚举的 Angular 文档的链接。

答案＃1

ViewEncapsulation 不仅允许从其他组件绑定你的内容——它还会停止封装你组件的 styles，所以如果你从组件装饰器中移除 style 或 styleUrls，封装将由编译器设置为 none

查看此文档以获取更多查询

下一步，你可以在使用 Angular CLI 创建组件时对其进行限制

ng generate component [name] --view-encapsulation=none

这将创建你的组件，封装属性为 none——你可以在这里查看一些命令

希望这能帮到你——编程愉快:)

答案＃2

你可以尝试在 app.component.ts 中设置 'ViewEncapsulation.None'，这将适用于你的整个项目。

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
  encapsulation: ViewEncapsulation.None
})