ngIfと@Input angular2 oddの動作

Question

NgIfは、コンソールがfalseと言っても常に真であると思われます。コンポーネントについては、以下のコンポーネントのHTMLをfalseに設定し、選択

<product-component-tree itemSku="{{item.itemSku}}" selectable="false" classes="col-md-12 col-xs-12"></product-component-tree> 

...

export class ProductComponentTree { 
@Input() classes: string; 
@Input() itemSku: string; 
@Input() selectable: boolean; 
ngOnInit() { 
    if (this.itemSku) 
     this.productDetailService.getComponents(this.itemSku, true).subscribe(x => { 
      this.treeData = x; 
     }); 
    console.log(this.selectable); //prints false 
} 
} 

Htmlのtmplateから

：

<div class="{{classes}}" *ngIf="selectable"> 
    something 
    <p-tree [value]="treeData" layout="horizontal" selectionMode="checkbox" [(selection)]="selectedProducts" (onNodeSelect)="nodeSelect($event)"></p-tree> 
</div> 
<div class="{{classes}}" *ngIf="!selectable"> 
    else 
    <p-tree [value]="treeData" layout="horizontal" [contextMenu]="productTreeCm" selectionMode="single" [(selection)]="selectedProduct"></p-tree> 
    <p-contextMenu #productTreeCm [model]="items"></p-contextMenu> 
</div> 

は常に何かを持つdiv要素を示していますその中に！

目標： selectableがfalseの場合、正しく動作し、else divを表示しましたか？

Answer 1

selectable="false"を実行すると、コンポーネントに文字列値が渡されます。

あなたが知っているように、「偽」は真理値です。

<product-component-tree [itemSku]="item.itemSku" [selectable]="false" ... 

：

は何がしなければならないことは、以下である：（https://dorey.github.io/JavaScript-Equality-Table/そうでない場合は、これを見て持っています）