angular4模塊中給標(biāo)簽添加背景圖的實現(xiàn)方法
更新時間：2017年09月15日 08:07:15 投稿：jingxian
下面小編就為大家?guī)硪黄猘ngular4模塊中給標(biāo)簽添加背景圖的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
一、現(xiàn)象
一個全屏的“走馬燈”每項需要添加背景圖，在循環(huán)標(biāo)簽里需要動態(tài)添加行內(nèi)樣式
二、解決
1、首先有一個圖片數(shù)組，如：
export class AppComponent {
array = ["url(/assets/images/img1.png)","url(/assets/images/img2.png)"];
}
2、模塊中添加數(shù)據(jù)，如：
<div nz-carousel-content *ngFor="let item of array" [ngStyle]="{'background-image': item }"></div>
三、總結(jié)
需要繼續(xù)思考，如果數(shù)組中不帶有url，只是單純的圖片路徑，應(yīng)該如何操作？
以上這篇angular4模塊中給標(biāo)簽添加背景圖的實現(xiàn)方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
Angular應(yīng)用的多語言設(shè)置問題解決示例
這篇文章主要為大家介紹了Angular應(yīng)用的多語言設(shè)置問題解決示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-07-07
Bootstrap + AngularJS 實現(xiàn)簡單的數(shù)據(jù)過濾字符查找功能
這篇文章主要介紹了 Bootstrap + AngularJS 實現(xiàn)簡單的數(shù)據(jù)過濾字符查找功能，代碼簡單易懂，非常不錯具有參考借鑒價值,需要的朋友可以參考下2017-07-07
本文主要介紹了Angular動態(tài)組件，對此感興趣的同學(xué)，可以親自實驗一下。2021-05-05
本篇文章主要介紹了詳解AngularJS ng-class樣式切換，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
angular.js+node.js實現(xiàn)下載圖片處理詳解
這篇文章主要介紹了angular.js+node.js實現(xiàn)下載圖片處理的相關(guān)資料，文中介紹的非常詳細(xì)，對大家具有一定的參考價值，需要的朋友們下面來一起看看吧。2017-03-03
Vue組件是學(xué)習(xí)Vue框架最比較難的部分,下面這篇文章主要給大家介紹了關(guān)于如何通過簡單的代碼描述Angular父組件、子組件傳值的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-04-04
Angular4學(xué)習(xí)筆記之實現(xiàn)綁定和分包
本篇文章主要介紹了Angular4學(xué)習(xí)筆記之實現(xiàn)綁定和分包，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
angularJs復(fù)選框checkbox選中進(jìn)行ng-show顯示隱藏的方法
今天小編就為大家分享一篇angularJs復(fù)選框checkbox選中進(jìn)行ng-show顯示隱藏的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10
Angular JS數(shù)據(jù)的雙向綁定詳解及實例
這篇文章主要介紹了Angular JS數(shù)據(jù)的雙向綁定詳解及實例的相關(guān)資料,需要的朋友可以參考下2016-12-12
本篇文章主要介紹了angular第三方包開發(fā)整理(小結(jié))，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-04-04