Angular 12 ::ng-deep（已弃用）？唯一有效的选择？

Question

我正在尝试更改 ngx-charts 中的文本，这很有效：

::ng-deep .ngx-charts { 
    text{
        fill: #ff0000; 
    }
}

唯一的问题是 ::ng-deep 已弃用？

:host 不行

那么我应该使用什么才有效呢？

Answer 1

您可能必须在样式中在全局级别应用此样式。[s]css 或在样式中导入的文件。[s]css/bundled 捆绑其他样式时全球 css.

（我通常直接从我的组件中获取路径，例如：）

app-my-component-that-uses-this-chart {
  .ngx-charts {
    text {
       fill: #ff0000;
    }
  }
}

但您也可以应用 class 而不是组件名称，以提高可重用性