2017-08-17 62 views
2

我是新角js。 我正在處理一個包含API數據列表表的項目。爲此,我使用library。 它工作正常。但是,如果有25個條目,並且當我將限制設置爲10並轉到第三頁時,它將顯示帶有10行5行空的表格。 我想刪除這些空行。請幫忙。刪除數據表中的空行角

myclass.html

<div style="margin: auto; max-width: 1000px; margin-bottom: 50px;"> 
    <data-table id="persons-grid" 
     headerTitle="Employees" 
     [items]="items" 
     [itemCount]="itemCount" 
     (reload)="reloadItems($event)" 

     (rowClick)="rowClick($event)" 
     (rowDoubleClick)="rowDoubleClick($event)" 
     [rowTooltip]="rowTooltip" 
     > 
     <data-table-column 
      [property]="'name'" 
      [header]="'Name'" 
      [sortable]="true" 
      [resizable]="true"> 
     </data-table-column> 
     <data-table-column 
      [property]="'date'" 
      [header]="'Date'" 
      [sortable]="true"> 
      <template #dataTableCell let-item="item"> 
       <span>{{item.date | date:'yyyy-MM-dd'}}</span> 
      </template> 
     </data-table-column> 
     <data-table-column 
      property="phoneNumber" 
      header="Phone number" 
      width="150px"> 
     </data-table-column> 
     <data-table-column 
      [property]="'jobTitle'" 
      [header]="'Job title'" 
      [visible]="false"> 
     </data-table-column> 
     <data-table-column 
      [property]="'active'" 
      [header]="'Active'" 
      [width]="100" 
      [resizable]="true"> 
      <template #dataTableHeader let-item="item"> 
       <span style="color: rgb(232, 0, 0)">Active</span> 
      </template> 
      <template #dataTableCell let-item="item"> 
       <span style="color: grey"> 
       <span class="glyphicon glyphicon-ok" *ngIf="item.active"></span> 
       <span class="glyphicon glyphicon-remove" *ngIf="!item.active"></span> 
       </span> 
      </template> 
     </data-table-column> 
    </data-table> 
</div> 

裝上屏幕截圖的參考。 enter image description here

+0

你可以創建[plunker](https://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5?p=catalogue)你的問題? –

+0

嘗試在標記中添加[substituteRows] =「false」,並讓我知道是否可以解決問題 –

+0

@vikk是的。謝謝回覆。 – nikhila

回答

3

在tag.It添加 [substituteRows]="false"

將解決這個問題。