Multiple Angular Material Table Sort
问题
在一个component里面,如果有多个mat-table matSort,怎么使用ViewChild
方案
使用ViewChild的时候,需要使用id
@ViewChild('sort1') sort1: MatSort;
在页面中,需要
<mat-table #table [dataSource]="dataSource" #sort1="matSort" matSort>
……
火鸡程序猿
在一个component里面,如果有多个mat-table matSort,怎么使用ViewChild
使用ViewChild的时候,需要使用id
@ViewChild('sort1') sort1: MatSort;
在页面中,需要
<mat-table #table [dataSource]="dataSource" #sort1="matSort" matSort>
……
一般来说,按angular material的官方文档, 在afterViewInit里面 可以把paginator或者sort和dataSource绑定在一起。但是如果这个table是在ngIf里面,也就是要在条件满足的情况下。这个时候的
@ViewChild(MatPaginator) paginator: MatPaginator;
可能就不好用了。因为还没有渲染,对应的还是null, 当然在最新的版本里面,ViewChild提供 static: false。
……如果想多行显示,可以把tooltip的内容用空格分开,同时样式
::ng-deep .mat-tooltip {
white-space: pre-line !important;
}
……
如果启动angular的时候有报 Javascript heap out of memory错误,可以试着修改
node_modules/.bin/ng
加上 --max_old_space_size
#!/usr/bin/env node --max_old_space_size=4096
'use strict';
……