Question

我在使用Angular Material Design时遇到了一个问题，我需要使用ng-deep来调整手风琴的样式。但是，我在其他地方使用手风琴，它具有相同的样式。这是不希望的。

应该这样做吗？我该如何解决？

Answer 1

ng-deep已过时，支持已从主要浏览器中删除。您可以在Angular Docs中详细了解它。

我建议您改为从组件中删除视图封装（None会删除该组件的样式封装，以便您可以定位Angular Material样式）。

import { ViewEncapsulation } from '@angular/core';

@Component({
    selector: 'app-example-component',
    templateUrl: './example.component.html',
    styleUrls: ['./example.component.scss'],
    encapsulation: ViewEncapsulation.None
})

Answer 2

我发现，为了使样式仅限于组件，我必须用:: host封装:: ng-deep代码，如下所示：

:host {
    ::ng-deep {
        /* ... custom styles here */
    }
}

ng-deep正在影响同级组件

2 个答案: