Angular2中如何使用ngStyle動態設定背景圖片？

在Angular2 中使用ngStyle 設定背景圖像

在Angular2 中，ngStyle 指令允許您動態地將CSS 樣式新增到基於元素的元素的元素中。關於 JavaScript 表達式。要使用ngStyle 設定背景圖像，您可以使用以下語法：

<code class="html"><div [ngStyle]="{'background-image': 'url(' + photo + ')'}"></div></code>

在您的程式碼中，您似乎錯過了URL 兩邊的單引號：

<code class="html"><div [ngStyle]="{'background-image': url(' + photo + ')}"></div></code>

To修復此問題，只需添加缺少的引號：

<code class="html"><div [ngStyle]="{'background-image': 'url(' + photo + ')'}"></div></code>

透過此更改，ngStyle 指令將正確應用提供的URL 作為div 元素的背景圖像。

以上是Angular2中如何使用ngStyle動態設定背景圖片？的詳細內容。更多資訊請關注PHP中文網其他相關文章！