Angular 2での条件分岐(if-else)の使い方

以下に、Angular 2での条件分岐の使い方とコード例をいくつか紹介します。

1. 単純な if-else 文の使用:

   <div *ngIf="condition">
   条件が true の場合に表示されるコンテンツ
   </div>
   <div *ngIf="!condition">
   条件が false の場合に表示されるコンテンツ
   </div>

2. else ブロックを含む条件分岐:

   <div *ngIf="condition; else elseBlock">
   条件が true の場合に表示されるコンテンツ
   </div>
   <ng-template #elseBlock>
   条件が false の場合に表示されるコンテンツ
   </ng-template>

3. 複数の条件を組み合わせた条件分岐:

   <div *ngIf="condition1 && condition2">
   条件1と条件2が両方とも true の場合に表示されるコンテンツ
   </div>
   <div *ngIf="condition1 || condition2">
   条件1または条件2が true の場合に表示されるコンテンツ
   </div>

4. else-if 文の代わりに ngSwitch ディレクティブを使用する方法:

   <div [ngSwitch]="condition">
   <div *ngSwitchCase="'case1'">
   条件が 'case1' の場合に表示されるコンテンツ
   </div>
   <div *ngSwitchCase="'case2'">
   条件が 'case2' の場合に表示されるコンテンツ
   </div>
   <div *ngSwitchDefault>
   どの条件にも一致しない場合に表示されるデフォルトのコンテンツ
   </div>
   </div>

上記のコード例は、Angular 2での条件分岐の基本的な使い方を示しています。追加の条件や制御フローが必要な場合は、それぞれのユースケースに応じて適切な方法を選択してください。Angularの公式ドキュメントやチュートリアルも参考になるでしょう。