在不破坏向前兼容性的情况下定位Shadow DOM元素

Question

我正在尝试定位由mat-menu创建的Angular Shadow DOM元素，如下所示：

$google: #133700

.mat-menu-content {
    background-color: $google;
}

然而，这不起作用。我被告知/deep CSS选择器可以帮助解决这个问题（它只是将/deep/选择器添加到上面的情况？）但是/deep/已被弃用，软件准备好的时候可能已经与现代浏览器不兼容了，所以目前它还不是一个合适的解决方案。任何人都可以建议另一种方法来在Angular中定位Shadow DOM元素吗？

Answer 1

/deep/已被CSS标准弃用。 Angular等价物是::ng-deep。它会穿透模拟封装（当然不是原生的）。

::ng-deep .mat-menu-content {
    background-color: $google;
}