Ionic2有條件地顯示範圍

Question

我在我的ionic2應用程序中有一個手風琴列表。我的組件有對象的JSON數組如下：

this.days= [ 

     { "id": 0, 
     "name": 'Ihr heutiger Trainingsplan', 
     "exercises":[ 

     {"id":1,"name":'Best Stretch', "watchedToday": 'true', "type":"body"}, 
     {"id":8,"name":'Farben', "watchedToday": 'false', "type":"memory"}, 

     {"id":2,"name":'Butterfly reverse', "watchedToday": 'false', "type":"body"}, 
     {"id":9,"name":'Punktgenaue Reaktion', "watchedToday": 'false', "type":"memory"}, 

     {"id":3,"name":'SquatRow', "watchedToday": 'false', "type":"body"}, 
     {"id":10,"name":'Loslassen', "watchedToday": 'false', "type":"memory"}, 

     // {"id":13,"name":'Wortpaare 1', "watchedToday": 'false', "type":"memory"}, 
     {"id":4,"name":'Plank', "watchedToday": 'false', "type":"body"}, 
     {"id":11,"name":'Wortpaare', "watchedToday": 'false', "type":"memory"}, //word-pair 1 : just show words 

     {"id":5,"name":'Push Up', "watchedToday": 'false', "type":"body"}, 
     {"id":12,"name":'Wortschatz', "watchedToday": 'false', "type":"memory"}, 

     // {"id":14,"name":'Wortschatz 1', "watchedToday": 'false', "type":"memory"}, // word-pair 2 : actual game 
     {"id":6,"name":'Side Plank', "watchedToday": 'false', "type":"body"}, 
     {"id":7,"name":'Squat', "watchedToday": 'false', "type":"memory"} 


     ] 
    } 
    ]; 

而且在我的模板，我遍歷它像以下：

<ion-list> 

    <div *ngFor="let day of days"><br> 
     <div (click)="toggleGroup(day)" [ngClass]="{active: isGroupShown(day)}"> 
     <ion-icon *ngIf="!isGroupShown(day)" name="add"></ion-icon> 
     <ion-icon *ngIf="isGroupShown(day)" name="remove"></ion-icon> 
     {{day.name}} 

    </div> 

    <button ion-item [hidden]="!isGroupShown(day)" *ngFor="let exercise of day.exercises"> 
     {{exercise.name}} 

     <!-- LED --> 

     <span style="float:right;"><ion-icon *ngIf="exercise.watchedToday" name="checkmark"></ion-icon></span>  
    </button> 

    </div> 
</ion-list> 

然而，這顯示了所有元素選中標記。

我想告訴勾選只對列表中的元素爲其watchedToday就像是在演習第一要素真。我怎樣才能實現它？

Answer 1

在你的JSON watchedToday是一個字符串，但它應該是一個布爾值（你應該刪除報價）

this.days= [ 

    { "id": 0, 
    "name": 'Ihr heutiger Trainingsplan', 
    "exercises":[ 

    {"id":1,"name":'Best Stretch', "watchedToday": true, "type":"body"}, 
    {"id":8,"name":'Farben', "watchedToday": false, "type":"memory"}, 

    ... 

    ] 
} 
];