Angular материал Paginator не работает

Я пытаюсь добавить Angular Material Paginator в свое приложение.

MatPaginatorModule добавлен в модуль.

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

Но это дает ошибку:

Ошибка при сбое: ошибки анализа шаблона:

Не может привязываться к "длине", поскольку он не является известным свойством "mat-paginator".

  1. Если mat-paginator является угловым компонентом и имеет length, то проверьте, что он является частью этого модуля.
  2. Если mat-paginator является веб-компонентом, добавьте 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",

Ответы

Ответ 1

На всякий случай кто-то сталкивается с этой проблемой, все, что требуется, это импортировать модуль в app.module.ts

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

и

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

Ответ 2

Это работает для меня. Я использую следующие версии:

"@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",

Ответ 3

Вы также импортируете MatTableModule.

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

Ответ 4

Я тоже использую paginator. Я импортирую:

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

это в моем app.module, @NgModule → тоже импортирует, но я получаю ту же ошибку:

Невозможно привязать к длине, так как это не известное свойство mat-paginator.

  1. Если "mat-paginator" является угловым компонентом и имеет вход "length", то убедитесь, что он является частью этого модуля.
  2. Если 'mat-paginator' является веб-компонентом, то добавьте 'CUSTOM_ELEMENTS_SCHEMA' к '@NgModule.schemas' этого компонента, чтобы подавить это сообщение.
  3. Чтобы разрешить любое свойство, добавьте "NO_ERRORS_SCHEMA" к "@NgModule.schemas" этого компонента.