命名空间角度材质样式

Question

我正在尝试使用 Angular 1.4.3 和 Angular-Material 1.0.5 创建可重用组件。想法是我们可以将这些组件集成到不同的应用程序中。

但我在这里面临的问题是 Angular 材质 CSS 具有应用于 html、body 等通用元素的某些样式，因为消费应用程序的样式被覆盖。

为了更清楚地说明这一点，请考虑一个示例应用程序 A，它具有自己的 'body'、'html'、'input' 标签样式。此应用程序将包含我的自定义组件的 CSS 和 JS 以获取我的可重用组件。这样做时，应用程序 A 失去了自己的样式。而且我不能对应用程序 A 的样式做“！重要”，因为我不拥有它们。

为了解决这个问题，我尝试在我的 grunt 构建过程中命名空间角度材质样式。但这并没有真正解决问题，而且我的大多数角度材料指令似乎都不起作用。

我尝试检查 angular material github 问题，但没有找到合适的解决方案。

https://github.com/angular/material/issues/6369

https://github.com/angular/material/issues/469

有没有办法正确命名角度材质样式？请帮忙。

Answer 1

不完全确定我是否理解正确，但在你自己的风格上使用!important 应该会覆盖由 Ng Material 设置的那些。

举一个你链接到的例子

input {
  font-family: Tahoma !important;
}

但是，请记住仅在真正需要时使用!important。就像在这种情况下，当您无法控制需要覆盖的样式时。