У меня есть компонент angular, у которого установлено направление flex-направления, как показано в фрагменте CSS ниже. Компонент включен в шаблон для другого компонента без применения дополнительных стилей (без встроенных стилей и ничего, что могло бы привести к тому, что на него будет ссылаться в любой таблице стилей в приложении). Однако, если я проверил его в браузере, есть несколько стилей элемента, переопределяющих то, что определено в правиле: host (см. Рис. 1). При первой инициализации компонента стили элемента совпадают с правилом: host, поэтому никакого вреда не будет. Что странно, так это то, что если компонент уничтожается и затем воссоздается (с помощью ngIf или ngSwitch), направление flex-стиля стилей элемента переключается на «row» (см. Рис. 2). Я знаю несколько способов обойти это, но у меня есть довольно много компонентов, где я испытываю это, и я просто пытаюсь понять, почему это происходит.
:host {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
width: 100%;
height: 100%;
overflow: hidden;
}
Рис. 1
Рис. 2
