如何不顯示錶，如果它是空的Angular2

我正在尋找一個解決方案，如何不顯示我的表，如果沒有數據。我試着用*ngIf但它沒有工作，也許我做錯了。如何不顯示錶，如果它是空的Angular2

我不認爲[hidden]是一個很好的解決方案。

這裏是我的代碼：

<div *ngIf="exceptions"> 
    <h1 class="applicationTitle">Exceptions</h1> 

    <table class="table table-hover table-condensed"> 
     <th>Date</th> 
     <th>Timeslot</th> 

     <tr *ngFor="#exception of exceptions"> 
      <td>{{exception.date}}</td> 
      <td>{{exception.value}}</td> 
     </tr> 
    </table> 
</div>

來源

2017-05-16 Florian Guebel

''是無效的角標記。它應該是'' –

嘗試'* ngIf =「exceptions.length」'。 –

@GünterZöchbauer爲什麼它是無效的標記？它對我來說工作得很好！如果我做「例外情況例外」，則不會顯示任何內容...... –

您可以使用*ngIf

<table *ngIf="exceptions" class="table table-hover table-condensed"> 
    <th>Date</th> 
    <th>Timeslot</th> 

    <tr *ngFor="let exception of exceptions"> 
     <td>{{exception.date}}</td> 
     <td>{{exception.value}}</td> 
    </tr> 
</table>

來源

2017-05-16 07:27:32

即使當我這樣做時，我得到一個錯誤：「無法讀取未定義的屬性值」。我知道它是未定義的，這是因爲我不想顯示它 –

聽起來就像你在你的代碼的其他地方使用'.value'或者'exceptions'包含'null'條目。 –

請檢查你在哪裏得到'null'。 –

<table class="table table-hover table-condensed" *ngIf="exceptions.length > 0">

但請記住ngIf將刪除從DOM元素，這可能是一個昂貴的操作，如果你的桌子真的很大。在這種情況下，您最好使用[hidden]。

來源

2017-05-16 07:28:18

<div *ngIf="exceptions.length > 0"> 
    <h1 class="applicationTitle">Exceptions</h1> 

    <table class="table table-hover table-condensed"> 
     <th>Date</th> 
     <th>Timeslot</th> 

     <tr *ngFor="#exception of exceptions"> 
      <td>{{exception.date}}</td> 
      <td>{{exception.value}}</td> 
     </tr> 
    </table> 
</div>

你只需要更新你的If條件即可。

來源

2017-05-16 07:29:41

試過了，得到了與第一個答案相同的錯誤.. :( –

@FlorianGuebel所以你現在得到了這個問題？ –

如何不顯示錶，如果它是空的Angular2

回答

相關問題