角材料表分页问题角10答案

【问题标题】：angular material table pagination issue angular 10角材料表分页问题角10
【发布时间】：2020-12-17 07:09:55
【问题描述】：

我正在为 Angular 10 项目使用 Angular 材料表。我成功添加了材料表。但现在我正在尝试将分页添加到我的表格中。因此我在我的组件中添加了以下代码。

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

我将上述导入添加到我的 app.module.ts 文件中。

这是我为我的 html 页面添加的用于加载分页的代码

 <mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>

但是这个 html 标记不起作用。发生错误。

请查看下图。

我的模块

【问题讨论】：

您在哪个模块中添加了导入？
您是否在 app.module 的导入数组中添加了 Class is-nside？还是只做你提到的进口事情？
@CharybdeBE 是的，我做到了。等我更新问题
这能回答你的问题吗？ How to use paginator from material angular?
你需要将分页器模块导入到你的组件所在的同一个模块中

标签： javascript angular angular-material

【解决方案1】：

正如您的 IDE 所述，该模块不知道该组件。解决方案是将其添加到您的 app.module.ts 中（或等效项，具体取决于您在应用程序中的位置）

你应该在你的应用模块中导入模块MatPaginatorModule

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { MatPaginatorModule } from '@angular/material/paginator';
import { AppComponent } from './app.component';


@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    MatPaginatorModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

请注意，我已经导入了模块，而不是直接导入了组件

【讨论】：