引导程序和角材料冲突

Question

我几乎已经完成了Angular项目的构建，我需要进行确认对话，因此我为此使用了Angular资料。 现在的问题是整个项目中我的引导样式混乱，我只需要Angular Material的确认对话框，并且不进行引导就重新构造整个项目样式并不实际。在这种情况下我该怎么办？

Answer 1

@Component({
  selector: 'your-component',
  encapsulation: ViewEncapsulation.Emulated
  styleUrls: ['./your.component.scss']
})

在your.component.scss内部，在第一行：

@import '~path/to/angular-material.css';

现在angular-material.css的作用域将仅限于您的组件，并且将不适用于您项目中的任何其他组件，甚至不适用于当前组件的子组件。

注意：encapsulation: ViewEncapsulation.Emulated是默认值，因此您实际上并不需要它，但是将其设置为任何其他值将阻止作用域。

详细了解封装here。