有什么办法可以在窗口调整大小时将Frozen =“ true” p-datatable属性设置为false

时间:2019-01-28 16:53:48

标签: angular primeng primeng-datatable

我正在尝试创建动态p数据表,该表在宽分辨率屏幕中具有一些冻结/固定的列,但是当分辨率为移动设备或平板电脑时它将变为未冻结状态。

我不知道primeNg v.5是否已为此准备好或是否内置了任何简单的实现,所以我正在尝试通过以下方式实现它:

我有条件地在模板上设置了冻结属性:

<p-column field="nro_pax" header="Ad" [frozen]="isFrozenTable ? 'true' : ''"></p-column>

在.TS文件中:

unableFrozenTable() {
    return window.innerWidth >= 1280 ? true : false;
}
@HostListener('window:resize', ['$event'])
    onResize() {
        this.isFrozenTable = this.unableFrozenTable();
        // this.changeDetectorRef.detectChanges();
        // this.ngZone.run(() => this.isFrozenTable = this.unableFrozenTable());
        // this.applicationRef.tick();
    }

但是问题是我需要重新渲染DOM,因为在我的p-Datatable具有冻结列的情况下生成的DOM包含四个表(一个用于未冻结的标头部分,一个用于冻结的标头部分,一个用于未冻结的主体部​​分,最后一个是冷冻的身体部位。

我尝试(如您在上面看到的)使用以下方法重新渲染:

this.changeDetectorRef.detectChanges(); or
this.ngZone.run(() => this.isFrozenTable = this.unableFrozenTable()); or
this.applicationRef.tick();

但这不是我预期的。

有人有解决办法吗?预先感谢。

0 个答案:

没有答案