Angular Material

Angular Material paginator API 参考文档

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

服务

`MatPaginatorIntl`

要修改显示的标签和文本，就要创建一个新的 MatPaginatorIntl 实例，并把它包含在自定义提供者中

To modify the labels and text displayed, create a new instance of MatPaginatorIntl and include it in a custom provider

属性

名称	描述
`changes: Subject<void>`	当标签发生变化时，要触发这个流。当初始化之后标签再发生变化时，用它来通知组件。 Stream to emit from when labels are changed. Use this to notify components when the labels have changed after initialization.
`firstPageLabel: string`	移动到第一页按钮的标签。 A label for the button that moves to the first page.
`getRangeLabel: (page: number, pageSize: number, length: number) => string`	当前分页当中条目范围的标签，以及整个列表的长度。 A label for the range of items within the current page and the length of the whole list.
`itemsPerPageLabel: string`	分页大小选择器的标签。 A label for the page size selector.
`lastPageLabel: string`	移动到最后一页按钮的标签。 A label for the button that moves to the last page.
`nextPageLabel: string`	用于增加当前分页按钮的标签。 A label for the button that increments the current page.
`previousPageLabel: string`	用于减小当前分页按钮的标签。 A label for the button that decrements the current page.

指令

`MatPaginator`

用于提供分页式信息导航的组件。显示当前分页的大小、用户可选的改变分页大小的选项、要显示的条目以及用于转到上一页或下一页的导航按钮。

Component to provide navigation between paged information. Displays the size of the current page, user-selectable options to change that size, what items are being shown, and navigational button to go to the previous or next page.

选择器： mat-paginator

导出为： matPaginator

属性

名称	描述
@Input() `color: ThemePalette`	要用于底层表单的主题颜色。 Theme color to be used for the underlying form controls.
@Input() `disabled: boolean`	Whether the component is disabled.
@Input() `hidePageSize: boolean`	是否隐藏用户的分页大小选择器界面。 Whether to hide the page size selection UI from the user.
@Input() `length: number`	被分页的条目总长度。默认为 0。 The length of the total number of items that are being paginated. Defaulted to 0.
@Input() `pageIndex: number`	显示的条目列表中从零开始的分页索引。默认为 0。 The zero-based page index of the displayed list of items. Defaulted to 0.
@Input() `pageSize: number`	每页显示的条目数。默认情况下，设置为 50。 Number of items to display on a page. By default set to 50.
@Input() `pageSizeOptions: number[]`	要显示给用户的分页大小选项的集合。 The set of provided page size options to display to the user.
@Input() `showFirstLastButtons: boolean`	是否要向用户显示第一个/最后一个按钮界面。 Whether to show the first/last buttons UI to the user.
@Output() `page: EventEmitter<PageEvent>`	当分页器改变分页大小或分页索引时会发生事件。 Event emitted when the paginator changes the page size or page index.
`initialized: Observable<void>`	Stream that emits once during the directive/component's ngOnInit.

方法

firstPage
如果不在第一页，请移动到第一页。 Move to the first page if not already there.

firstPage

如果不在第一页，请移动到第一页。

Move to the first page if not already there.

getNumberOfPages

getNumberOfPages
计算页数 Calculate the number of pages
`number`

计算页数

Calculate the number of pages

返回值

Returns

number

hasNextPage

hasNextPage
是否有下一页。 Whether there is a next page.
`boolean`

是否有下一页。

Whether there is a next page.

返回值

Returns

boolean

hasPreviousPage

hasPreviousPage
是否有上一页。 Whether there is a previous page.
`boolean`

是否有上一页。

Whether there is a previous page.

返回值

Returns

boolean

lastPage
如果不在最后一页，就移动到最后一页。 Move to the last page if not already there.

lastPage

如果不在最后一页，就移动到最后一页。

Move to the last page if not already there.

nextPage
如果存在，就进入下一页。 Advances to the next page if it exists.

如果存在，就进入下一页。

Advances to the next page if it exists.

previousPage
如果存在，就回到上一页。 Move back to the previous page if it exists.

如果存在，就回到上一页。

Move back to the previous page if it exists.

类

`PageEvent`

当用户选择不同的分页大小或导航到另一个分页时，会改变这个事件对象。

Change event object that is emitted when the user selects a different page size or navigates to another page.

属性

名称	描述
`length: number`	当前正被分页的条目总数 The current total number of items being paged
`pageIndex: number`	当前的分页索引。 The current page index.
`pageSize: number`	当前分页大小 The current page size
`previousPageIndex: number`	以前选择过的分页索引。 Index of the page that was selected previously.

接口

`MatPaginatorDefaultOptions`

可用于配置分页器模块默认选项的对象。

Object that can be used to configure the default options for the paginator module.

属性

名称	描述
`formFieldAppearance: MatFormFieldAppearance`	要应用于分页大小选项选择器的默认表单字段外观。 The default form-field appearance to apply to the page size options selector.
`hidePageSize: boolean`	是否隐藏给用户的分页大小选择界面。 Whether to hide the page size selection UI from the user.
`pageSize: number`	分页上显示的条目数。默认情况下，设置为 50。 Number of items to display on a page. By default set to 50.
`pageSizeOptions: number[]`	要显示给用户的分页大小选项的集合。 The set of provided page size options to display to the user.
`showFirstLastButtons: boolean`	是否要向用户显示第一个/最后一个按钮界面。 Whether to show the first/last buttons UI to the user.

常量

`MAT_PAGINATOR_DEFAULT_OPTIONS`

这个注入令牌可以用来为分页器模块提供默认选项。

Injection token that can be used to provide the default options for the paginator module.

const MAT_PAGINATOR_DEFAULT_OPTIONS: InjectionToken<MatPaginatorDefaultOptions>;

Angular Material paginator-testing API 参考文档

import {MatPaginatorHarness} from '@angular/material/paginator/testing';

类

`MatPaginatorHarness` extends ComponentHarness

在测试中用来与标准 mat-paginator 进行交互的测试工具。

Harness for interacting with a standard mat-paginator in tests.

方法

异步 getPageSize
Gets the page size of the paginator.
`Promise<number>`

异步

getPageSize

Gets the page size of the paginator.

返回值

Returns

Promise<number>

异步 getRangeLabel
Gets the text of the range labe of the paginator.
`Promise<string>`

异步

getRangeLabel

Gets the text of the range labe of the paginator.

返回值

Returns

Promise<string>

异步 goToFirstPage
Goes to the first page in the paginator.
`Promise<void>`	Promise that resolves when the action completes.

异步

goToFirstPage

Goes to the first page in the paginator.

返回值

Returns

Promise<void>

Promise that resolves when the action completes.

异步 goToLastPage
Goes to the last page in the paginator.
`Promise<void>`	Promise that resolves when the action completes.

异步

goToLastPage

Goes to the last page in the paginator.

返回值

Returns

Promise<void>

Promise that resolves when the action completes.

异步 goToNextPage
Goes to the next page in the paginator.
`Promise<void>`	Promise that resolves when the action completes.

异步

goToNextPage

Goes to the next page in the paginator.

返回值

Returns

Promise<void>

Promise that resolves when the action completes.

异步 goToPreviousPage
Goes to the previous page in the paginator.
`Promise<void>`	Promise that resolves when the action completes.

异步

goToPreviousPage

Goes to the previous page in the paginator.

返回值

Returns

Promise<void>

Promise that resolves when the action completes.

异步 host
获取一个代表该组件宿主元素的 `TestElement` 型 `Promise`。 Gets a `Promise` for the `TestElement` representing the host element of the component.
`Promise<TestElement>`

异步

host

获取一个代表该组件宿主元素的 TestElement 型 Promise。

Gets a Promise for the TestElement representing the host element of the component.

返回值

Returns

Promise<TestElement>

异步 setPageSize
Sets the page size of the paginator.
参数 Parameters
size `number`	Page size that should be select.
返回值 Returns
`Promise<void>`	Promise that resolves when the action completes.

接口

`PaginatorHarnessFilters`

A set of criteria that can be used to filter a list of MatPaginatorHarness instances.

分页器 API 目录

Testing

Angular Material paginator API 参考文档

link 服务

link MatPaginatorIntl

属性

link 指令

link MatPaginator

属性

方法

link 类

link PageEvent

属性

link 接口

link MatPaginatorDefaultOptions

属性

link 常量

link MAT_PAGINATOR_DEFAULT_OPTIONS

Angular Material paginator-testing API 参考文档

link 类

link MatPaginatorHarness extends ComponentHarness

方法

link 接口

link PaginatorHarnessFilters

服务

`MatPaginatorIntl`

指令

`MatPaginator`

类

`PageEvent`

接口

`MatPaginatorDefaultOptions`

常量

`MAT_PAGINATOR_DEFAULT_OPTIONS`

类

`MatPaginatorHarness` extends ComponentHarness

接口

`PaginatorHarnessFilters`