錯誤百科

樣式屬性繫結的值無效

Angular 在樣式屬性繫結中偵測到型別不受支援的值。這可能發生在個別繫結(例如 [style.width])中,或 [style] 對應表中的某個屬性中。

樣式屬性的值可以是字串、數字、樣式用的 SafeValue 物件、null 與 undefined。其他值——包括為非樣式安全上下文所建立的 SafeValue 物件——在開發模式下會產生這個警告。

例如,以下繫結傳入的是布林值,而不是 CSS 值:

<div [style.display]="isVisible"></div>

如何除錯

利用錯誤訊息中的屬性名稱與值,找出該繫結。請把值轉換成有效的 CSS 字串或數字,或使用 null 或 undefined 來移除該樣式。

使用單位後綴(例如 [style.width.px])時,請繫結值的數字部分:

<div [style.width.px]="width"></div>

不要把為其他安全上下文(例如受信任的 HTML)所建立的 SafeValue,傳給樣式屬性繫結。