2017-04-21 1 views
0

NgIf는 콘솔에 false가 있다고하더라도 항상 true 인 것처럼 보입니다. 구성 요소에 대한 false로 선택할 수있는 설정은 다음 구성 요소 HTMLngIf 및 @Input angular2 odd 동작

<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> 

은 뭔가 사업부를 보여줍니다 그것 안에!

목표 : selectable이 false 인 경우 올바르게 작동하고 else div를 표시합니다.

답변

2

selectable="false"을 수행하면 구성 요소에 문자열 값이 전달됩니다.

아시다시피 "거짓"은 진리 값입니다.

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

은 당신이해야 할 일은 다음과 같다 : (https://dorey.github.io/JavaScript-Equality-Table/ 그렇지 않으면,이를 보라)