在Angular 2中顯示沒有找到記錄

我一直在搜索，並想知道是否有任何指令，以幫助在表中顯示「沒有數據」，當表是在角2中爲空。或者更好的是，我可以創建該功能在我的服務，當我訂閱提取的數據？在Angular 2中顯示沒有找到記錄

<table> 
    <tbody> 
     <tr *ngFor="let game of Games"> 

     </td> 
      <td>{{game.name}}</td> 
      <td>{{game.type}}</td> 
      </tr> 


     </tbody> 
</table>

來源

2017-04-13 Switz

標記angularjs只能用於Angular 1.x請不要拒絕編輯。 –

檢查數組的長度，

<li *ngIf="Games?.length == 0"> 
    <span class="search_no_results"> 
        No data found 
       </span> 
</li>

來源

2017-04-13 09:08:03 Sajeetharan

如果你想顯示一個消息，說沒找到的數據。在表格標籤之前檢查遊戲是否有要迭代的項目。

像這樣的事情

public hasData(): boolean { 
return (this.Games != null && this.Games.length > 0); 
}

使用hasData（）在模板

您可以構建&風格這個反正你想要的。

來源

2017-04-13 09:12:53 Nugu

您可以使用最新的功能從角4.0.0，並添加if else聲明：

<div *ngIf="Games?.length;else no_data_templ"> 
    <table> 
     <tbody> 
      <tr *ngFor="let game of Games"> 
       <td>{{game.name}}</td> 
       <td>{{game.type}}</td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

<ng-template #no_data_templ> 
    No daata found... 
</ng-template>

更新：對角2.X您可以用下面的辦法：

<div *ngIf="Games?.length"> 
    <table> 
     <tbody> 
      <tr *ngFor="let game of Games"> 
       <td>{{game.name}}</td> 
       <td>{{game.type}}</td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

<div *ngIf="! Games?.length"> 
    No data found... 
</div>

來源

2017-04-13 09:13:01

它可能不會在角2.3正確的？ – Switz

不，它不會工作。對於2.3，你必須設置兩個條件：'

your content

'和'

No data found

'。但我建議您更新到Angular 4.遷移很簡單;） –

我會盡快升級，但有時會造成一些錯誤，這些錯誤有時可能會解決。你能否通過重新編輯答案來讓條件更清楚？ – Switz

-1

您可以使用*ngIf進行條件式顯示/隱藏所需DOM元素

<div *ngIf="!Games"> 
No data found!!! 
</div> 
<div *ngIf="Games"> 
<table> 
    <tbody> 
     <tr *ngFor="let game of Games"> 
      <td>{{game.name}}</td> 
      <td>{{game.type}}</td> 
     </tr> 
    </tbody> 
</table>

來源

2017-08-10 12:14:41

在Angular 2中顯示沒有找到記錄

回答

相關問題