2017-02-15 51 views
1

我有一個使用Teradata Covalent Data Table組件的Angular2 web應用程序,啓用了數據分頁和行選擇。數據正在通過REST API以小塊形式提取,而不是一次所有行,因此行選擇不會在來回分頁過程中自動呈現。即如果我選擇第1頁上的一行,然後導航到第2頁,然後返回第1頁,則第1頁上的選定行不會突出顯示。Angular2 Teradata共價數據表row選擇問題

我不確定這是否可以通過blah.component.html文件中的模板條目處理,或者我需要在blah.component.ts(TypeScript)文件中執行某些操作。

由於行被選中和取消選擇,我正在跟蹤數字數組中選定的行唯一標識。在.ts文件中 - > selectedItems:number [];

下面是數據表中的html代碼:

<td-data-table [data]="items.content" [columns]="columns" [sortable]="true" [sortBy]="sortBy" [sortOrder]="sortOrder" [selectable]="true" [multiple]="true" (sortChange)="sort($event)" (rowSelect)="selectRow($event)" (selectAll)="selectAllRows($event)"> 
<template tdDataTableTemplate="matchCount" let-value="value" let-row="row" let-column="column"> 
    <div layout="row"> 
     <span flex>{{value | number:0}}</span> 
    </div> 
</template> 
<template tdDataTableTemplate="itemSize" let-value="value" let-row="row" let-column="column"> 
    <div layout="row"> 
     <span flex>{{value | bytes}}</span> 
    </div> 
</template> 

+0

嘗試添加[(ngModel)] = 「selectedRows」 在和此陣列將自動添加和從數組中刪除選擇的行。如果你沒有做服務器端分頁,它的工作很好。我沒有檢查這個服務器端分頁。 –

+0

非常感謝Vinay的迴應。我在發佈這個問題後不久就添加了精確的代碼片段,結果不一。選定的行現在確實被添加到「selectedRows」變量中並在其中進行跟蹤,但是當來回翻頁時,UI不會更新具有先前選擇的信息。我想知道是否因爲我們正在爲每個頁面事件加載一小部分數據,而不是通過一整套數據進行分頁。 – user1946444

回答

3

我伸出了小膠質的Teradata /共價的聊天組,他們能夠幫助我。您只需遍歷selectedRows中的值和新數據集中的值以查找任何匹配。如果找到匹配,只需使用.splice從selectedRows中將其刪除,然後將其從數據集中添加回來。實際上它只是手動更新ngmodel。

this.selectedRows.splice(parseInt(x),1,this.newRow.content[y]);

+0

感謝您分享您的答案。 –