angular2のNgSwitchの理解

Question

こんにちは、私はangular2を学ぼうとしているので、エラーが発生しました。親コンポーネント内の子コンポーネントを置き換えることに決めました。子コンポーネントAとBの両方が、組み込みのngSwitchを使用してお互いを置き換えます。しかし、私は子コンポーネントAと子コンポーネントBの両方へのネイティブプロパティバインディングではなく、それについて不平を言ってエラーが発生しました。両方の子コンポーネントにプロパティをバインドできないようです。しかし、私は下に動作するソリューションを見つけたが、なぜ後者の作品を理解していない。私はangular2からのチュートリアルに従った。誰かが最初の失敗したソリューションと2番目のソリューションが提供された理由を説明できますか？ありがとう。親の

parent.html

<div class= "col-md-4" [ngSwitch]="componentNumber"> 
    <child-componentA *ngSwitchCase="1"> </child-componentA> 
    <child-componentB *ngSwitchCase="2"> </child-componentB> 
</div> 

component.tsファイル：

import {Component} from '@angular/core'; 
//metadata tags defined but didn't need to include 

export class Parent { 

    componentNumber: number = 1; 

    ChangeComponent(value: number) { 
     this.componentNumber = value; 
    } 
} 

以下のコードは、私の問題を解決しますが、私は以下のように上記の前のコードが失敗した理由私は理解して失敗していますanuglar docsの例

次のコードを使用して解決した問題：

<div class="col-md-4" [ngSwitch]="componentNumber"> 
    <template> 
     <child-componentA [ngSwitchWhen]="1"></child-componentA> 
    </template> 
    <template> 
     <child-componentB [ngSwitchWhen]="2"></child-componentB> 
    </template> 
    </div> 

Answer 1

最新RC4のバージョンを使用している場合は、