第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

基于項(xiàng)目值的 Angular 類名稱

基于項(xiàng)目值的 Angular 類名稱

月關(guān)寶盒 2023-09-07 17:09:02
<div>我想知道如何根據(jù)角度中的項(xiàng)目值添加動(dòng)態(tài)類名稱?例子項(xiàng)目狀態(tài)為open添加類別bg-success或項(xiàng)目狀態(tài)為pending添加類別bg-warning代碼Componentconst badgeColors = {  'Open': 'bg-primary',  'pending': 'bg-warning',  'Finished': 'bg-success',  'Expired': 'bg-danger'}HTML<div class="col-md-3" *ngFor="let item of listOfData" :key="item.id">  <div class="card">    <div class="otherClasses bg-warning"></div> <-- I need to change this static `bg-warning` to dynamic `badgeColors`  </div></div>
查看完整描述

2 回答

?
長風(fēng)秋雁

TA貢獻(xiàn)1757條經(jīng)驗(yàn) 獲得超7個(gè)贊

你可以簡單地在你的div上調(diào)用ngClass,就像


[ngClass]="displayDynamicColour(item.status)"

在你的ts中


const badgeColors = {

  'Open': 'bg-primary',

  'pending': 'bg-warning',

  'Finished': 'bg-success',

  'Expired': 'bg-danger'

}


displayDynamicColour(item){

return this.badgeColors[item];

}


查看完整回答
反對(duì) 回復(fù) 2023-09-07
?
喵喵時(shí)光機(jī)

TA貢獻(xiàn)1846條經(jīng)驗(yàn) 獲得超7個(gè)贊

您可以使用 ngClass 指令。例如:

<div [ngClass]="{'bg-success': (status === open), 'bg-warning': (status === pending)}"> </div>


查看完整回答
反對(duì) 回復(fù) 2023-09-07
  • 2 回答
  • 0 關(guān)注
  • 151 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)