Angular - стили игнорируются / перезаписываются

Question

У меня проблема со стилями, которые не применяются к элементам. Если я добавлю информацию о стиле в параметр стилей компонента или предоставлю файл CSS в параметре styleUrls, я получу ожидаемые результаты. Однако встроенные стили HTML не применяются. В приведенном ниже примере я пытаюсь применить красный фон к div, но он остается белым. Этот HTML существует как шаблон для углового компонента.

<div style="background: red;">test</div>

Однако, если я добавлю ngStyle="" к элементу, например:

<div style="background: red;" ngStyle="">test</div>

Затем Angular отображает фон div в красном.

Есть идеи, что заставляет Angular игнорировать такие атрибуты стиля?

Answer 1

В итоге я обновил все свои библиотеки (с Angular 4 до Angular 5), и без каких-либо изменений кода информация о стиле была отредактирована, как и ожидалось.

Answer 2

ngStyle и стиль одинаковы, они применяют стили. Вы можете заполнить оба, и оба будут применять стили (один не отменяет другой, если оба не пытаются сделать то же самое), но с помощью [ngStyle] вы можете связать его с атрибуты в вашем коде, например: [ngStyle]="{backgroundColor: getColor()}", getColor() - функция, которая задерживает строку или гекс для цвета.

Этот фрагмент, например, должен быть действительным в угловых 2 (На работе, так что не могу проверить)

<div style="background-color: black;" [ngStyle]="{color: white}">text with back background and white font color</div>

Почему директива ngStyle объявлена ​​в []?