2016-08-22 95 views
0

我在Angular 2應用程序中使用PrimeNG數據表,我必須堅持選擇路線變化。目前,我設置應用程序的狀態,像這樣:堅持PrimeNG DataTable選擇路線變化

onTableRowStateChange() { 
    this.appState.set('selectedApplicants', this.selectedApplicants); 
} 

哪裏APPSTATE是保存選擇狀態的服務。這也被用來堅持一些選擇開啓的標籤。

雖然appState設置正確,但會返回一個選定的應用程序數組並保留打開的選項卡,但它不會在數據表中保留實際選擇,因此可以再次選擇條目。

的HTML看起來像這樣:

<p-dataTable tableStyleClass="table" [value]="applicants" 
       [(selection)]="selectedApplicants" 
       (onRowSelect)="onTableRowStateChange()" 
       (onRowUnselect)="onTableRowStateChange();"> 
     <header>Applications</header> 
     <p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column> 
     <p-column *ngFor="let col of cols" [field]="col.field" [header]="col.header"></p-column> 
</p-dataTable> 

我試圖用一個this.appState.get('selectedApplicants')方法來獲得在`ngOnInit的selectedApplicants陣列,在構造函數中,甚至設置它像這樣:在

selectedApplicants:any[] = (this.appState.get('selectedApplicants').length > 0) ? this.appState.get('selectedApplicants') : this.appState.set('selectedApplicants', []); 

組件。

但是,雖然它返回所選應用程序的數組,但它不會在表中選擇它們。

作爲一個方面說明,在關閉標籤時做this.selectedApplicants.splice(event.index, 1);可以取消選擇表格條目,所以可以通過改變選定的條目數組來編程改變選擇。即使存在所需的數組,它也不會在路由更改後啓動視圖時自動選擇條目。

是否有解決方法或任何方式來堅持路線變化的數據表選擇?

+0

我想讓PrimeNG組件在Plnkr中工作。一旦我這樣做,我可能會給你一個答案。 –

回答

0

發現我的問題。我正在初始化數組,該數組在ngOnInit期間用於DataTable [value]屬性中。因此,selection,value和在這種情況下的applicants陣列基本上在每個視圖初始化時都攜帶不同的對象(同時攜帶相同的數據)。

我之前所做的是將selectedApplicants陣列中的對象推入表selectionvalue陣列。雖然它確實有效,但在清除表格陣列並將保存的對象從應用程序狀態推送到它們之前,必須先執行兩個forEach循環,這不是一個好的選擇。這對於二三個對象來說並不可怕,但是如果我不得不處理更多的事情,它會極大地減慢應用程序的速度。

因此,解決方案是使用這樣的:

applicants:any[] = (this.appState.get('applicants').length > 0) ? this.appState.get('applicants') : this.appState.set('applicants', this.getApplicants()); 

然後檢查是否有存在的申請人和初始化設置appState,如果他們不。

if (this.appState.get('applicants').length < 1) { 
    this.appState.set('applicants', this.getApplicants()) 
} 

這從appState並讓他們保持了相同的陣列從路由改變之前重新初始化它們只在需要的地方。