角度如何使用ng深，但仍然只影响一个组成部分？

Question

在一个角度应用程序中，使用角材料作为主题，当主题变暗时，我尝试更新组件中的css类。

这是可行的，但它会影响所有组件，放松封装：

::ng-deep .dark-theme { // must have ::ng-deep to see .dark-theme on body
  .action-button:hover {
    color: #ffffff;
  }
}

我怎么能得到相同的结果，但只对一个组件？

正如提到的here，我尝试过这样做，但似乎对我不起作用：

::ng-deep .dark-theme {
  :host .action-button:hover {
    color: #ffffff;
  }
}
// OR
:host ::ng-deep .dark-theme .action-button:hover {
  color: #ffffff;
}

Answer 1

试试这个：

当我们将视图封装(模拟)设置为所需的组件时，样式将只应用于组件模板中的元素。

@Component({ selector：‘app-仿制-封装’，模板：‘，样式：''，封装:视图封装.Emulated，})

通过提供有限的信息来实际测试该场景，如果在@Component块中设置Encapsulation属性可以解决问题，则可以避免使用ng深度和主机。

请参考- https://angular.io/guide/view-encapsulation获得更多信息。