Что означает: host /deep/ selector?
пожалуйста, объясните прямо, что :host /deep/
означает:
:host /deep/ .ui-autocomplete {
width: 85%;
}
1 ответов
он используется для стилизации дочерних компонентов при использовании emulated
инкапсуляция вид.
подробнее об этом можно прочитать здесь:
https://angular.io/guide/component-styles
кстати /deep/
селектор теперь устарел:
комбинатор потомков теневого пирсинга устарел, и поддержка удаляется из основных браузеров и инструментов. Таким образом, мы планируем отказаться от поддержки в Angular (для всех 3 /deep/, >>> и:: ng-deep). До тех пор:: ng-deep следует предпочесть для более широкой совместимости с инструментами.
:host
используется для обращения к элементу хостинга - это тот, который вы используете для добавления компонента где-то (например,<app-component>
).
используйте селектор псевдо-класса :host для целевых стилей в элементе, в котором размещен компонент (в отличие от элементов таргетинга внутри шаблона компонента).
Итак, селектор :host /deep/ .ui-autocomplete
означает "на текущем элементе хостинга углубитесь (поиск в дочерних компонентах тоже) и ищите элементы с классом ui-autocomplete
.
вот некоторые дополнительные сведения о просмотре объектов заключение:
https://blog.thoughtram.io/angular/2015/06/29/shadow-dom-strategies-in-angular2.html