ionic3 ngfor異なるCSS

Question

と私は配列リストをループしていて、その中のオブジェクトがキー値を含めることは「isRead」です

<button ion-item text-wrap *ngFor="let notice of notices" ng-style="{ 'background': notice.isRead=='1': ? '#DCF7E3': '#FFFFFF' }"> 
    <ion-avatar item-start> 
    <img src="{{notice.imageUrl}}" style="border-radius:0px;"> 
    </ion-avatar> 
    <h3 [hidden]="slang!='en'" style="color:#172845;">{{notice.msgEN}}</h3> 
    <h3 [hidden]="slang!='zh'" style="color:#172845;">{{notice.msgTW}}</h3> 
</button> 

私の問題は、 "isRead"を使って背景色を変えたいと思っていますが、今は動作していないようです。

Answer 1

避けインラインスタイル、あなたのようなクラスを変更することができます。

[ngClass]="{'class1': notice.isRead == 1, 'class2': notice.isRead == 0}" 

は、あなたのCSSファイルで：

.class1 { 
background: #DCF7E3; 
} 
.class2 { 
background: #FFFFFF; 
} 

あなたは明らか目的に、より関連性があるとクラス名を変更することができます。