角度元素：对材料的依赖性

我正在创建一个 Angular Element用于其他项目.元素是在其模板中包含Angular Material组件的组件,因此最终我的元素要求页面为< link>材质主题CSS文件(以及材质图标和材质字体文件,链接标记只能出现在文档的< head>中).

很高兴地说,所需要的只是调用platformbrowser().bootstrapModuleFactory(…)并写入< some-custom-element>在页面上没有进一步的指示.那可能吗？

要求我的自定义元素的用户链接到< head>中的所有CSS文件是否可以接受他们的页面？我想这个模式,以后添加新的依赖项不会是向后兼容的更改,我必须告诉大家添加新的CSS文件或创建一个新的自定义元素.

解决方法

您可能需要将组件的封装设置为ViewEncapsulation.None.

@Component({
    selector: 'pay-button',templateUrl: './pay-button.component.html',styleUrls: ['./pay-button.component.scss'],//include material related css here
    encapsulation: ViewEncapsulation.Native
})