web-dev-qa-db-ja.com

Angular material Paginatorが機能していません

アプリにAngular Material Paginatorを追加しようとしています。

MatPaginatorModuleモジュールに追加されました。

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

しかし、エラーが発生します：

不明なエラー：テンプレート解析エラー：

「mat-paginator」の既知のプロパティではないため、「length」にバインドできません。

  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",
angularpaginationangular5angular-material2angular-material-paginator
13
Umer MehAr

他の誰かがこの問題に遭遇した場合に備えて、app.module.tsのモジュールをインポートするだけです。

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

そして

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

それは私のために働いています。次のバージョンを使用しています。

"@angular/animations": "5.0.2",
"@angular/common": "^5.0.2",
"@angular/compiler": "^5.0.2",
"@angular/core": "^5.0.2",
"@angular/forms": "^5.0.2",
"@angular/http": "^5.0.2",
"@angular/material": "^5.0.0-rc0",
"@angular/cdk": "^5.0.0-rc0",
"@angular/platform-browser": "^5.0.2",
"@angular/platform-browser-dynamic": "^5.0.2",
"@angular/router": "^5.0.2",
0
Srini

私は言及すべきだと思う一つのことに気づきました、それは多分有用かどうか。 Angular Materials version 5を使用している場合、paginatorモジュールは

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

しかし、Angular 8以降は

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

必ずapp.module.tsにもモジュールを追加してください

0
Saurabh Kumar

MatTableModuleもインポートします。

import {MatTableModule} from '@angular/material/table';
0
Amir