刷新ngx-datatable标头

时间:2018-08-17 13:08:41

标签: angular ngx-datatable

对于我要构建的数据表,我需要使用动态标题(单击按钮时,将不同的数据加载到表中,并且标题需要更改)。我正在使用它来在软删除用户和普通用户之间切换(删除列变为恢复列)。

更新行,并使用该表按如下所述工作: this.rows = [...this.rows];

更新我的专栏是另外一回事。我已经使用this.columns = [...this.columns];进行了相同的尝试,但这不会刷新表头。现在,我有了一个表,其中标题仅在后台刷新时才更改,而我似乎找不到自己触发刷新的方法。我的桌子看起来像这样:

<ngx-datatable
            [rows]="rows"
            [columns]="columns"
            [columnMode]="'flex'"
            [sortType]="'single'"
            [headerHeight]="50"
            [footerHeight]="50"
            [selected]="selected"
            (select)='onSelect($event)'
            [selectionType]="'checkbox'"
            [selectAllRowsOnPage]="true"
            [limit]="rowLimit"
            [reorderable]="false"
            [rowHeight]="'auto'" style="width: 100%">
</ngx-datatable>

这是我更新各列的代码:

this.route.params.subscribe(params => {
        this.state = params.state;

        if (this.state === 'deleted') {
            this.columns[columnIndex].name = 'Recover';
        } else if (this.state === 'notactivated') {
            this.columns[columnIndex].name = 'Delete';
        }

1 个答案:

答案 0 :(得分:0)

好的,我花了几个小时,但我发现了。这有点骇人听闻,但是如果我将列ID设置为undefined,则可以强制刷新列。下面的代码可以工作,并在每次列标题更新时强制刷新(我称其为switchedColumn):

// If there is a switchedColumn, remove the old column and add this as a new column to force a refresh
        if(switchedColumn && switchedColumn.$$id) {
            this.columns = this.columns.filter(c => c.$$id != switchedColumn.$$id);
            switchedColumn.$$id = undefined;
            this.columns = [...this.columns, switchedColumn]
        }