*同じ属性の3つの異なる値をテストするためのangular2のng

Question

私はangular2を使い慣れていますが、*ngIfを使用したいと思います。だから、私はオブジェクトitem内の属性typeは、このタイプが唯一持っている可能性が持ってこれらの3つの文字列のいずれか：

1. TYPE_A
2. TYPE_B
3. 不定

とに応じて、 item.typeという値が表示されます。私はこのように使いましたが、画像は表示されません。画像は表示されません。

<li *ngIf="item.type === type_A"> 
    <img src="assets/images/typeA-icons.png"/> 
</li> 
<li *ngIf="item.type === type_B"> 
    <img src="assets/images/typeB-icons.png"/> 
</li> 
<li *ngIf="item.type === unspecified"> 
    <img src="assets/images/unspecified-icons.png"/> 
</li> 

どうすればいいですか？すべての

Answer 1

まず、あなたはtypescriptですとことをやっていないのはなぜあなたがhttps://angular.io/docs/ts/latest/api/common/index/NgSwitch-directive.html

<container-element [ngSwitch]="switch_expression"> 
    <some-element *ngSwitchCase="match_expression_1">...</some-element> 
    <some-element *ngSwitchCase="match_expression_2">...</some-element> 
    <some-other-element *ngSwitchCase="match_expression_3">...</some-other-element> 
    <ng-container *ngSwitchCase="match_expression_3"> 
    <!-- use a ng-container to group multiple root nodes --> 
    <inner-element></inner-element> 
    <inner-other-element></inner-other-element> 
    </ng-container> 
    <some-element *ngSwitchDefault>...</some-element> 
</container-element> 

Answer 2

ngSwitch演算子を探している

item.type === type_A 

の

item.type === 'type_A' 

代わりに引用符にあなたの文字列をラップする必要があり：

public get itemImage() { 
    let type = this.item && this.item.type; 
    if(type === "type_A") return 'assets/images/typeA-icons.png'; 
    if(type === "type_B") return 'assets/images/typeB-icons.png'; 
    return 'assets/images/unspecified-icons.png'; 
} 

HTML

<img [src]="itemImage" />