角质材料Paginator无法正常工作

Question

我想在我的应用程序上添加Angular Material Paginator.

在模块中添加了MatPaginatorModule.

<mat-paginator #paginator 
               [length]="100" 
               [pageSize]="10" 
               [pageSizeOptions]="[5, 10, 25, 100]">
</mat-paginator>

但它给出了一个错误:

未捕获错误:模板解析错误:

无法绑定到'length',因为它不是'mat-paginator'的已知属性.

1. 如果mat-paginator是Angular组件并且它有length输入,则验证它是否是此模块的一部分.
2. 如果mat-paginator是一个Web组件,然后添加CUSTOM_ELEMENTS_SCHEMA到@NgModule.schemas该组件来抑制此消息.

也许我错过了什么？

"@angular/animations": "^5.0.1",
"@angular/cdk": "^5.0.0-rc0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/material": "^5.0.0-rc0",

Answer 1

为了防止其他人遇到此问题,只需在app.module.ts中导入模块即可

import { MatPaginatorModule } from '@angular/material';

和

@NgModule({
...
imports: [ 
....
MatPaginatorModule ]

Answer 2

我注意到一件事，我认为我应该提一下，它可能有用与否。如果您使用的是 Angular Materials 版本 5，则分页器模块存在于

import {MatPaginatorModule} from '@angular/material';

但是从 Angular 8 开始，它出现在

import {MatPaginatorModule} from '@angular/material/paginator';

一定要在 app.module.ts 中添加模块