意外的未知伪元素选择器“::ng-deep”

Question

我正在尝试覆盖角度材料，因此我使用了::ng-deep，但在声纳库中出现错误。请帮我解决这个问题。

Answer 1

在您的 stylelint 配置中（在此示例中为 .stylelintrc.json）添加以下规则：

{
  "rules": {
    "selector-pseudo-element-no-unknown": [true, { "ignorePseudoElements": ["ng-deep"] }]
  }
}

这将允许ng-deep伪元素而不禁用规则

Answer 2

试试这样

:host {

  ::ng-deep {

    //css

  }

如果我们希望组件样式级联到组件的所有子元素，而不是页面上的任何其他元素，我们目前可以通过将 :host 与 ::ng-deep 选择器结合使用来实现：

:host ::ng-deep h2 {
    color: red;
}

这将在运行时生成如下所示的样式：

<style>  
[_nghost-c0]  h2 {
    color: red;
}
</style>
}