Как переопределить угловые глобальные стили без использования инкапсуляции: ViewEncapsulation.None или :: ng-deep?

Question

Мне нужно переопределить глобальные стили, определенные в файле src / styles.scss, в определенном угловом компоненте.

Я знаю, что могу сделать это, выполнив что-то вроде следующего

import { ViewEncapsulation } from '@angular/core';<br> @Component({ ... encapsulation: ViewEncapsulation.None })

или используя ::ng-deep или /deep/ или >>> , как требуется.

Оба эти метода, похоже, имеют недостаток. Метод ViewEncapsulation.None, кажется, делает мои переопределенные стили глобальными, и мои архитекторы не убеждены в использовании ::ng-deep, поскольку они пытаются применять стили к элементам, избегая областей, применяемых ViewEncapsulation.Emulate, я полагаю.

Можно ли мне предложить альтернативное решение?

Answer 1

Это действительно хорошее объяснение на hackernoon . К сожалению, они почти все, если не уже устарели.

Я думаю, вам нужно посмотреть на: host, который нацелен на шаблон текущего компонента, над которым вы работаете. Это, конечно, относится только к этому компоненту.