ngForの値を非表示にする

Question

リスト内の要素を表示および非表示にする必要があります。リストには、*ngForを使用してデータが入力されます。

これらのアイコンを変更する必要があります。私はを使ってBooleanの値を*ngFor から得るでしょう。私はtsファイルを使うべきではありません。 .htmlファイルでこの変更を行う必要があります。

<ion-grid> 
     <ion-row *ngFor="let item of dailyDays"> 
      <ion-col> 
       <ion-icon show={{item.check}} name="checkmark"></ion-icon> 
       <ion-icon show={{item.check}} name="close"></ion-icon> 
      </ion-col> 
     </ion-row> 
</ion-grid> 

誰かがあなたはこれが私のために働いた[attr.name]属性（プロパティバインディング）

<ion-icon [attr.name]="item.check ? 'checkmark': 'close'"></ion-icon> 

Answer 1

から私はBoolean値を使用して、これらのアイテムを表示し、非表示にする助けてもらえウィルこの作品いつでも

Answer 2

を使用することができます{{item.check}}

Answer 3

はあなたの作業をする必要がありますが、次のようにコードを編集するngSwitch

の使用をしなければならないngIf

<ion-col> 
       <ion-icon *ngIf="item.check" name="checkmark"></ion-icon> 
       <ion-icon *ngIf="!item.check" name="close"></ion-icon> 
      </ion-col> 

Answer 4

もしてみてくださいでした。

<ion-grid> 
    <ion-row *ngFor="let item of dailyDays"> 
     <ion-col [ngSwitch]="item.check"> 
      <ion-icon *ngSwitchCase="true" name="checkmark"></ion-icon> 
      <ion-icon *ngSwitchCase="false" name="close"></ion-icon> 
     </ion-col> 
    </ion-row> 
</ion-grid> 

また、あなたは、デフォルトのアイコンのために* ngSwitchDefault代わりにケースの

輸入コードの下に使用してTSファイル内ngSwitchモジュールを追加することができます。

import { NgSwitch } from @angular/common; 

Answer 5

「名前」は角張っている場合

<ion-col> 
 
    <ion-icon [name]="item.check ? 'checkmark' : 'close'"></ion-icon> 
 
</ion-col>

のアイコンアイコンコンポーネントのプロパティは Inputです。 ngIfまたはngSwitch