Angular Material Paginator is undefined

问题

I use Angular Material (MatTable, MatPaginator). when i log in to my application and my component view is loaded, i get the following error in my browser debugger:

    ERROR TypeError: "_this._paginator is undefined; can't access its "pageIndex" property"

    ExampleDataSource http://localhost:4200/main.js:1446
    __tryOrUnsub http://localhost:4200/vendor.js:160732
    next http://localhost:4200/vendor.js:160670
    _next http://localhost:4200/vendor.js:160603
    next http://localhost:4200/vendor.js:160578
    _subscribe http://localhost:4200/vendor.js:159751
    _trySubscribe http://localhost:4200/vendor.js:159963
    _trySubscribe http://localhost:4200/vendor.js:160384

my goal is to get rid of this error.

as there is too much code that could be responsible for this error, please see my component at my Github: https://github.com/chrs-k/Behaeltermanagement/tree/master/Behaeltermanagement/client/src/app/table

The problem must be located in the table.component.ts

Thank you very much in advance!

回答1:

Paginator is marked with @ViewChild, and thus will not be loaded until ngAfterViewInit() is called. However, you put an instance of constructing a new ExampleDataSource inside loadData(), which is called in ngOnInit. But according to the order of Angular lifestyle hook methods, ngOnInit() will be called before ngAfterViewInit(). You have called it at least twice already before ngAfterViewInit()! So put this.loadData() into ngAfterViewInit, and up top you should have

dataSource: ExampleDataSource;

Remove anything that depends on this.paginator to instead be in ngAfterViewInit.

来源：https://stackoverflow.com/questions/53741120/angular-material-paginator-is-undefined

标签

angular

typescript

angular-material

paginator