[英]angular how to resize ngx-datatable while closing and opening nav bar
Before clicking on the on the navbar the <ngx-datatable>
looks like this在点击导航栏上的
<ngx-datatable>
之前看起来像这样
And after clicking on the navbar it looks like this单击导航栏后,它看起来像这样
As you see in the second picture the navbar columun did not resize after clicking.正如您在第二张图片中看到的那样,导航栏列在单击后没有调整大小。
Here is the code这是代码
<ngx-datatable
#table
class="material"
[rows]="data"
[loadingIndicator]="loadingIndicator"
columnMode="force"
[headerHeight]="60"
[footerHeight]="80"
rowHeight="auto"
[limit]="10"
[scrollbarH]="scrollBarHorizontal"
[reorderable]="reorderable"
[selected]="selected"
[selectionType]="'checkbox'"
(select)="onSelect($event)"
>
I looked for help but but couldn't find the solution.我寻求帮助,但找不到解决方案。 Thank you.
谢谢你。
You need to refresh the rows of the table every time you click on the side bar toggle.每次单击侧栏切换时,您都需要刷新表格的行。
In my use case, I needed to do the refresh after some amount of time along with ChangeDetectorRef
to make it work.在我的用例中,我需要在一段时间后与
ChangeDetectorRef
一起进行刷新以使其正常工作。 Here is a snippet of my code:这是我的代码片段:
import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
@Component({
selector: 'app-test',
templateUrl: './test.component.html',
styleUrls: ['./test.component.scss']
})
export class TestComponent implements OnInit {
constructor(private changeDetector: ChangeDetectorRef) { }
ngOnInit(): void {
// ...
}
// Call this function every time you close or open your sidenav
resizeTable() {
setTimeout(() => {
this.data = [...this.data];
this.changeDetector.detectChanges();
}, 500);
}
}
Hopefully this helps!希望这会有所帮助!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.