排序后如何获取ngx-datatable中更新的排序项

问题描述 投票:0回答:1

我正在使用 swimlane/ngx-datatable 库来显示列表。在每一行的列表中,我动态添加带有项目的操作菜单(当单击图标时,菜单将显示为弹出窗口)。

问题: 对项目进行排序后,在表单中进行排序,但是当我单击操作菜单时,它显示错误的项目。

RCA: 每行的操作菜单项始终基于初始表项而不是更新的排序项生成。

请帮助我了解如何在排序后获取 ngx-datatable 中更新的表对象。

<ngx-datatable #table class="table-element elevation-1 bootstrap" [cssClasses]="tableConfig.cssClasses"
            [rows]="tempDocumentCollection" [columns]="columns" [rowClass]="getRowClass" [reorderable]="true"
            [headerHeight]="tableConfig.headerHeight" [footerHeight]="tableConfig.footerHeight"
            [rowHeight]="tableConfig.rowHeightSmall" selectionType="checkbox" (select)='onSelect($event)'
            [scrollbarV]="true" [scrollbarH]="true" columnMode="flex" style="width:100%" ngxColumnMode>
            <ngx-datatable-footer>
                <ng-template ngx-datatable-footer-template let-rowCount="rowCount" let-pageSize="pageSize"
                    let-selectedCount="selectedCount" let-curPage="curPage" let-offset="offset">
                    <div class="container-fluid d-flex align-items-center">
                        <span class="total">{{'DEFAULT.TOTAL' | translate }} {{ rowCount.toLocaleString() }}</span>
                        <si-pagination [currentPage]="curPage" [totalRowCount]="rowCount" [pageSize]="pageSize"
                            (currentPageChange)="table.onFooterPage({ page: $event })" class="ms-auto">
                        </si-pagination>
                    </div>
                </ng-template>
            </ngx-datatable-footer>

我在排序事件中尝试使用以下代码,但“tempDocumentCollection”始终显示相同的数据而不是排序的数据。

onSort(row: any) {
        this.tempDocumentCollection = [...this.tempDocumentCollection];
        const data = this.tempDocumentCollection;
        this.tempDocumentCollection = [];
        this.changeDetectorRef.detectChanges();
        this.tempDocumentCollection = [...data];
    }
angular angularjs ngx-datatable
1个回答
0
投票
<ngx-datatable .... #table>
</ngx-datatable>
@ViewChild(DatatableComponent) table: DatatableComponent;
public getGridData() {
    console.log(this.table._internalRows)
}

希望这对您有帮助。

© www.soinside.com 2019 - 2024. All rights reserved.