angular - 角材料分页器不工作

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 中添加模块

Answer 3

对我来说，它也需要MatChipsModule编译。

import { MatChipsModule } from '@angular/material/chips';