ngSwitch 多條件判斷

src/app/app.component.html

@@ -8,6 +8,5 @@
 </ng-template>
 
 <ng-template #list>
-  <app-task *ngFor="let task of tasks; let odd=odd" [class.odd]="odd"
-  [task] = "task"></app-task>
+  <app-task *ngFor="let task of tasks; let odd = odd" [class.odd]="odd" [task]="task"></app-task>
 </ng-template>

src/app/task/task.component.html

@@ -1,2 +1,7 @@
-<span>{{ task.TaskSn }} </span>
 <span>{{task.TaskName}}</span>
+<div [ngSwitch]="task.State">
+  <div *ngSwitchCase="'Doing'">進行中</div>
+  <div *ngSwitchCase="'Finish'">已完成</div>
+  <div *ngSwitchDefault>未安排</div>
+</div>
+