2017-09-15 3 views
0

Ich zeige eine P-Datentabelle in einem P-Dialog in einer meiner Komponente. Wenn ein Benutzer zuvor einige Zeilen aus dieser Tabelle ausgewählt hat, muss ich sie anzeigen lassen, wenn der Benutzer das nächste Mal den P-Dialog aufruft.primeng: Datatable nicht verbindlich Auswahl Eigenschaft asynchron

Ich übergebe ein Array von ausgewählten Elementen an die selection-Eigenschaft der p-Datentabelle. Die Zeilen werden jedoch nicht auf dem Bildschirm ausgewählt angezeigt.

Wenn ich die gleichen Zeilen erneut auswählen, bekomme ich sie zweimal in selection Eigenschaft, die die vorgewählten Reihen bedeutet in selection Eigenschaft zu Recht gehalten, aber irgendwie nicht auf die html binded.

Ich habe versucht, den gesamten P-Dialog in eine *ngIf zu wickeln, in der Erwartung, dass es erst erstellt wird, nachdem die Daten empfangen wurden, aber es machte keinen Unterschied.

Was kann ich tun, um die ausgewählten Zeilen an die p-Datentabelle zu binden.

<div *ngIf="data && data.length" class="col-sm-12"> 
    <p-dataTable #ListRef [value]="data" rowHover="true" [multiSortMeta]="multiSortMeta" (onRowSelect)="onSelect($event)" [(selection)]="selectedData" (onRowUnselect)="onUnSelect($event)"> 
     <p-column field="launchDate" header="Launch Date" [sortable]="true"></p-column> 
     <p-column field="endDate" header="End Date" [sortable]="true"></p-column> 
    </p-dataTable> 
    </div> 

Ich habe auch versucht, die Referenz Abrufen die Werte auf die selection Eigenschaft dort mit ViewChild und zuweisen. Auch das machte keinen Unterschied.

Ich habe jedoch festgestellt, dass das Problem nicht kommt, wenn ich die data und selectedData bereits in meiner ngOnInit-Methode zur Verfügung habe.

Irgendwelche Ideen?

+0

Wie übergibt man ein Array ausgewählter Elemente an die Auswahleigenschaft 'selectedData'? Es ist möglich, dass die Ansicht nach der Zuweisung nicht aktualisiert wird. Ich schlage vor, Verwenden Sie Spread-Operator statt Push. – TimeTraveler

+0

Ich ordne das Array einfach der Eigenschaft 'selection' zu. –

Antwort

0

Obwohl ich es zuerst verpasste, fand ich später, dass es eine Eigenschaft dataKey gibt, die für den Vergleich der ausgewählten Zeilen mit den gesamten Zeilen zugewiesen werden kann. Das hat für mich funktioniert. Die einzige Änderung war ein Feldnamen zuweisen eindeutig die Zeilen entsprechen

<p-dataTable #fundListRef [value]="data" rowHover="true" [(selection)]="selectedData" (onRowSelect)="onFundSelect($event)" (onRowUnselect)="onFundUnSelect($event)" 
     dataKey="id"> 

Die p-Datatable-Dokumentation sagt, dass es eine Karte Vergleich verwendet, die war irgendwie nicht für meinen Fall zu arbeiten.

Verwandte Themen