ng-for的Angular2隱藏元素

使用ng-for時如何過濾元素？ng-for的Angular2隱藏元素

<tr> 
    <td *ng-for="#col of columns" ><a (click)="sort(col.name)">{{col.title}}</a></td> 
</tr>

我不想當col.visible是假

如何在Angular2這樣做是爲了創建一個元素？

來源

2015-07-13 Murali

解釋，我認爲你需要的是什麼叫角1的過濾器，現在被稱爲管道，看到這個答案http://stackoverflow.com/questions/31214924/角-2-僅酮指令每次元件。在管道上檢查這個https://angular.io/docs/js/latest/api/pipes/以及如何創建一個自定義的 - > https://angular.io/docs/js/latest/api/change_detection/Pipe -class.html –

使用ngIf指令。 col.visible = true表示僅添加td，否則不會添加到tr中。

ngIf指令基於{expression}刪除或重新創建DOM樹的一部分。如果分配給ngIf的表達式將評估爲false值，則將該元素從DOM中移除，否則將該元素的一個克隆重新插入到DOM中。

<tr> 
    <td ng-if="col.visible" ng-for="#col of columns" ><a ng-click="sort(col.name)">{{col.title}}</a></td> 
</tr>

來源

2015-07-13 09:58:52

每個元素只允許有一個模板指令：ng-if col.visible和ng-for不能同時用於null – Murali

什麼是ng--它是一個自定義指令啊？ –

在這種情況下，以最簡單的做法是，以確保您的列陣列只填充了山坳對象，其中col.visible === true。

在控制器類中這樣做可以解決這個問題，不需要任何標記過濾器或其他特定於框架的依賴關係。

來源

2015-07-21 22:35:37 TGH

Angular2的語法已經改變了一下。對於釋放，對於* ngIf語法是：

<div class="row pre-scrollable" *ngIf="count > 0"> 
    <div *ngFor="let image of results"> 
     {{image.title}} 
    </div> 
</div>

結果是某些對象有一個標題和計數是陣列中的項目數的數組。

在這種情況下，div用於具有可滾動的結果列表，如果沒有結果，則隱藏滾動條。

來源

2016-06-03 01:21:11

您可以使用管道過濾數據，使得只有一個子集使用*ngFor像

How to apply filters to *ngFor

，或者您可以使用*ngIf與*ngFor解釋，但他們不能在同一元件。如何使用它們一起無論如何在*ngIf and *ngFor on same element causing error

來源

2016-06-03 04:24:58

ng-for的Angular2隱藏元素

回答

相關問題