Я пытаюсь создать динамическую таблицу данных p-Datatable, в которой есть несколько замороженных / фиксированных столбцов на экране с широким разрешением, но она становится незамороженной при мобильном разрешении или на планшете.
Я не знаюесли 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, потому что сгенерированный DOM в случае, если в моем p-Datatable есть замороженные столбцы, содержит четыре таблицы(один для незамерзшей части заголовка, один для замороженной части заголовка, один для незамерзшей части тела и последний для замороженной части тела).
Я попытался (как вы можете видеть выше) перерисовать, используя:
this.changeDetectorRef.detectChanges(); or
this.ngZone.run(() => this.isFrozenTable = this.unableFrozenTable()); or
this.applicationRef.tick();
но это было не так, как я ожидал.
Есть ли у кого-нибудь решение ??Заранее спасибо.