Angular Material

Angular CDK table API 参考文档

import {CdkTableModule} from '@angular/cdk/table';

指令

`CdkTable`

一个可以渲染表头行、数据行和表尾行的数据表格。使用输入属性 dataSource 来确定要渲染的数据。这些数据既可以提供为数据数组，也可以提供为要渲染数组的 Observable 流，还提供为一个带有 connect 函数的 DataSource，该函数将返回一个发出要渲染的数组的 Observable 流。

A data table that can render a header row, data rows, and a footer row. Uses the dataSource input to determine the data to be rendered. The data can be provided either as a data array, an Observable stream that emits the data array to render, or a DataSource with a connect function that will return an Observable stream that emits the data array to render.

选择器： cdk-table table[cdk-table]

导出为： cdkTable

属性

名称	描述
@Input() `dataSource: CdkTableDataSourceInput<T>`	该表格的数据源可以通过三种方式提供（按复杂程度排序）： The table's source of data, which can be provided in three ways (in order of complexity): 简单数据数组（每个对象代表格一个表格行） Simple data array (each object represents one table row) 每当数组发生变化时都会发出数据数组的流 Stream that emits a data array each time the array changes 那些实现了 connect / disconnect 接口的 `DataSource`。 `DataSource` object that implements the connect/disconnect interface. 如果提供了数组，那么在添加、删除或移动该数组的对象时，都必须通知该表格。这可以通过调用 `renderRows()` 函数来完成，它会渲染自上次渲染表格以来的差异部分。如果数据数组的引用发生了变化，该表格会自动触发对行的更新。 If a data array is provided, the table must be notified when the array's objects are added, removed, or moved. This can be done by calling the `renderRows()` function which will render the diff since the last table render. If the data array reference is changed, the table will automatically trigger an update to the rows. 当提供一个可观察的流时，如果该流发出一个新的数据数组，该表格就会自动触发一次更新。 When providing an Observable stream, the table will trigger an update automatically when the stream emits a new array of data. 最后，在提供 `DataSource` 对象时，该表格将使用 connect 函数提供的 Observable 流，并在该流发出新的数据数组值时触发更新。在表格的 ngOnDestroy 中，或者从表格中删除了数据源时，该表格会调用数据源的 `disconnect` 函数（这可能对清理在连接过程中注册的所有订阅很有帮助）。 Finally, when providing a `DataSource` object, the table will use the Observable stream provided by the connect function and trigger updates when that stream emits new data array values. During the table's ngOnDestroy or when the data source is removed from the table, the table will call the DataSource's `disconnect` function (may be useful for cleaning up any subscriptions registered during the connect process).
@Input() `fixedLayout: boolean`	是否使用固定（fixed）表格布局。启用此选项会强制让所有列宽一致，并优化渲染原生表格的粘性样式。对弹性（flex）表格无效。 Whether to use a fixed table layout. Enabling this option will enforce consistent column widths and optimize rendering sticky styles for native tables. No-op for flex tables.
@Input() `multiTemplateDataRows: boolean`	通过计算哪些行的 'when' 谓词结果为 true 来允许其数据对象对应于多行。如果 `multiTemplateDataRows` 为 false（这是默认值），那么每个数据对象都会渲染到其谓词结果为 true 的第一行（按照表格中定义的顺序），否则就使用默认行（即没有 when 谓词的行）。 Whether to allow multiple rows per data object by evaluating which rows evaluate their 'when' predicate to true. If `multiTemplateDataRows` is false, which is the default value, then each dataobject will render the first row that evaluates its when predicate to true, in the order defined in the table, or otherwise the default row which does not have a when predicate.
@Input() `trackBy: TrackByFunction<T>`	跟踪函数，用于检查数据变化的差异。类似于 `ngFor` 的 `trackBy` 函数。可以优化行操作，方法是根据该函数处理后的数据来标识一行，以了解该行是否应添加/删除/移动。接受带两个参数 `index` 和 `item` 的函数。 Tracking function that will be used to check the differences in data changes. Used similarly to `ngFor` `trackBy` function. Optimize row operations by identifying a row based on its data relative to the function to know if a row should be added/removed/moved. Accepts a function that takes two parameters, `index` and `item`.
`needsPositionStickyOnElement: true`	是否要为所有粘性单元格元素手动添加 position: sticky。如果 position 是在与 stickyCssClass 值相关联的选择器中设置的，则不需要。可以被表格的子类所改写 Whether to manually add positon: sticky to all sticky cell elements. Not needed if the position is set in a selector associated with the value of stickyCssClass. May be overridden by table subclasses
`stickyCssClass: string`	CSS 类被添加到任何已应用了粘性定位的行或单元格中。可以被表格的子类改写。 CSS class added to any row or cell that has sticky positioning applied. May be overriden by table subclasses.

方法

addColumnDef

addColumnDef
添加一个未包含在内容子组件中的列定义。 Adds a column definition that was not included as part of the content children.
columnDef `CdkColumnDef`

添加一个未包含在内容子组件中的列定义。

Adds a column definition that was not included as part of the content children.

参数

Parameters

columnDef

CdkColumnDef

addFooterRowDef

addFooterRowDef
添加一个未包含在内容子组件中的表尾行定义。 Adds a footer row definition that was not included as part of the content children.
footerRowDef `CdkFooterRowDef`

添加一个未包含在内容子组件中的表尾行定义。

Adds a footer row definition that was not included as part of the content children.

参数

Parameters

footerRowDef

CdkFooterRowDef

addHeaderRowDef

addHeaderRowDef
添加一个未包含在内容子组件中的表头行定义。 Adds a header row definition that was not included as part of the content children.
headerRowDef `CdkHeaderRowDef`

添加一个未包含在内容子组件中的表头行定义。

Adds a header row definition that was not included as part of the content children.

参数

Parameters

headerRowDef

CdkHeaderRowDef

addRowDef

addRowDef
添加一个未包含在内容子组件中的行定义。 Adds a row definition that was not included as part of the content children.
rowDef `CdkRowDef<T>`

添加一个未包含在内容子组件中的行定义。

Adds a row definition that was not included as part of the content children.

参数

Parameters

rowDef

CdkRowDef<T>

removeColumnDef

removeColumnDef
删除那些未包含在内容子组件中的列定义。 Removes a column definition that was not included as part of the content children.
columnDef `CdkColumnDef`

删除那些未包含在内容子组件中的列定义。

Removes a column definition that was not included as part of the content children.

参数

Parameters

columnDef

CdkColumnDef

removeFooterRowDef

removeFooterRowDef
删除一个未包含在内容子组件中的表尾行定义。 Removes a footer row definition that was not included as part of the content children.
footerRowDef `CdkFooterRowDef`

删除一个未包含在内容子组件中的表尾行定义。

Removes a footer row definition that was not included as part of the content children.

参数

Parameters

footerRowDef

CdkFooterRowDef

removeHeaderRowDef

removeHeaderRowDef
删除那些未包含在内容子组件中的表头行定义。 Removes a header row definition that was not included as part of the content children.
headerRowDef `CdkHeaderRowDef`

删除那些未包含在内容子组件中的表头行定义。

Removes a header row definition that was not included as part of the content children.

参数

Parameters

headerRowDef

CdkHeaderRowDef

removeRowDef

removeRowDef
删除那些未包含在内容子组件中的行定义。 Removes a row definition that was not included as part of the content children.
rowDef `CdkRowDef<T>`

删除那些未包含在内容子组件中的行定义。

Removes a row definition that was not included as part of the content children.

参数

Parameters

rowDef

CdkRowDef<T>

renderRows
根据表格中最新的数据集来渲染行，这些数据既可以直接输入，也可以从一个可观察的流中检索出来（直接获取或从 DataSource 获取）。检查自上次 diff 之后的数据差异，以便只进行必要的修改（添加/删除/移动行）。 Renders rows based on the table's latest set of data, which was either provided directly as an input or retrieved through an Observable stream (directly or from a DataSource). Checks for differences in the data since the last diff to perform only the necessary changes (add/remove/move rows). 如果表格的数据源是 DataSource 或者 Observable，每当提供的 Observable 流发出一个新的数据数组时，都会自动调用它。如果你的数据是数组，那么就需要手动调用这个函数来渲染任何变化。 If the table's data source is a DataSource or Observable, this will be invoked automatically each time the provided Observable stream emits a new data array. Otherwise if your data is an array, this function will need to be called to render any changes.

renderRows

根据表格中最新的数据集来渲染行，这些数据既可以直接输入，也可以从一个可观察的流中检索出来（直接获取或从 DataSource 获取）。检查自上次 diff 之后的数据差异，以便只进行必要的修改（添加/删除/移动行）。

Renders rows based on the table's latest set of data, which was either provided directly as an input or retrieved through an Observable stream (directly or from a DataSource). Checks for differences in the data since the last diff to perform only the necessary changes (add/remove/move rows).

如果表格的数据源是 DataSource 或者 Observable，每当提供的 Observable 流发出一个新的数据数组时，都会自动调用它。如果你的数据是数组，那么就需要手动调用这个函数来渲染任何变化。

If the table's data source is a DataSource or Observable, this will be invoked automatically each time the provided Observable stream emits a new data array. Otherwise if your data is an array, this function will need to be called to render any changes.

setNoDataRow

setNoDataRow
设置一个没有包含在内容子组件中的无数据行定义。 Sets a no data row definition that was not included as a part of the content children.
noDataRow `CdkNoDataRow`

设置一个没有包含在内容子组件中的无数据行定义。

Sets a no data row definition that was not included as a part of the content children.

参数

Parameters

noDataRow

CdkNoDataRow

updateStickyColumnStyles
更新列的粘性样式。首先，对于已粘附在左右两侧的单元格，重置所有已应用的样式。然后，根据每一行中每个单元格的列定义，评估哪些单元格需要粘附在左侧或右侧。当列定义的粘性属性发生变化时，会自动调用它。如果单元格内容在上述事件之外发生了变化，可以手动调用。 Updates the column sticky styles. First resets all applied styles with respect to the cells sticking to the left and right. Then sticky styles are added for the left and right according to the column definitions for each cell in each row. This is automatically called when the data source provides a new set of data or when a column definition changes its sticky input. May be called manually for cases where the cell content changes outside of these events.

updateStickyColumnStyles

更新列的粘性样式。首先，对于已粘附在左右两侧的单元格，重置所有已应用的样式。然后，根据每一行中每个单元格的列定义，评估哪些单元格需要粘附在左侧或右侧。当列定义的粘性属性发生变化时，会自动调用它。如果单元格内容在上述事件之外发生了变化，可以手动调用。

Updates the column sticky styles. First resets all applied styles with respect to the cells sticking to the left and right. Then sticky styles are added for the left and right according to the column definitions for each cell in each row. This is automatically called when the data source provides a new set of data or when a column definition changes its sticky input. May be called manually for cases where the cell content changes outside of these events.

updateStickyFooterRowStyles
更新表尾的粘性样式。首先，对于已粘附在底部的单元格，重置所有已应用的样式。然后，评估哪些单元格需要粘附在底部。当表尾行所显示的一组列发生变化时，或者其粘性属性发生变化时，会自动调用它。如果单元格内容在上述事件之外发生了变化，可以手动调用。 Updates the footer sticky styles. First resets all applied styles with respect to the cells sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is automatically called when the footer row changes its displayed set of columns, or if its sticky input changes. May be called manually for cases where the cell content changes outside of these events.

updateStickyFooterRowStyles

更新表尾的粘性样式。首先，对于已粘附在底部的单元格，重置所有已应用的样式。然后，评估哪些单元格需要粘附在底部。当表尾行所显示的一组列发生变化时，或者其粘性属性发生变化时，会自动调用它。如果单元格内容在上述事件之外发生了变化，可以手动调用。

Updates the footer sticky styles. First resets all applied styles with respect to the cells sticking to the bottom. Then, evaluating which cells need to be stuck to the bottom. This is automatically called when the footer row changes its displayed set of columns, or if its sticky input changes. May be called manually for cases where the cell content changes outside of these events.

updateStickyHeaderRowStyles
更新表头的粘性样式。首先，对于已粘附在顶部的单元格，重置所有已应用的样式。然后，评估哪些单元格需要粘附在上面。当表头行所显示的一组列发生变化时，或者其粘性属性发生变化时，会自动调用它。如果单元格内容在上述事件之外发生了变化，可以手动调用。 Updates the header sticky styles. First resets all applied styles with respect to the cells sticking to the top. Then, evaluating which cells need to be stuck to the top. This is automatically called when the header row changes its displayed set of columns, or if its sticky input changes. May be called manually for cases where the cell content changes outside of these events.

updateStickyHeaderRowStyles

更新表头的粘性样式。首先，对于已粘附在顶部的单元格，重置所有已应用的样式。然后，评估哪些单元格需要粘附在上面。当表头行所显示的一组列发生变化时，或者其粘性属性发生变化时，会自动调用它。如果单元格内容在上述事件之外发生了变化，可以手动调用。

Updates the header sticky styles. First resets all applied styles with respect to the cells sticking to the top. Then, evaluating which cells need to be stuck to the top. This is automatically called when the header row changes its displayed set of columns, or if its sticky input changes. May be called manually for cases where the cell content changes outside of these events.

`CdkCellDef`

CDK 表格的单元格定义。存放列的数据行单元格的模板以及单元格的专有属性。

Cell definition for a CDK table. Captures the template of a column's data row cell as well as cell-specific properties.

选择器： [cdkCellDef]

`CdkHeaderCellDef`

CDK 表格的表头单元格定义。存放列的表头单元格的模板以及单元格的专有属性。

Header cell definition for a CDK table. Captures the template of a column's header cell and as well as cell-specific properties.

选择器： [cdkHeaderCellDef]

`CdkFooterCellDef`

CDK 表格的表尾单元格定义。存放列的表尾单元格的模板以及单元格的专有属性。

Footer cell definition for a CDK table. Captures the template of a column's footer cell and as well as cell-specific properties.

选择器： [cdkFooterCellDef]

`CdkColumnDef`

CDK 表格的列定义。定义一组可用于表列的单元格。

Column definition for the CDK table. Defines a set of cells available for a table column.

选择器： [cdkColumnDef]

属性

名称	描述
@Input('cdkColumnDef') `name: string`	这个列的唯一名称。 Unique name for this column.
@Input() `sticky: boolean`	是否应该使用粘性定位。 Whether sticky positioning should be applied.
@Input('stickyEnd') `stickyEnd: boolean`	此列是否应粘性在该行的末尾。应该确保它模仿了混入接口 `CanStick`，当该值更改后必须把 `_hasStickyChanged` 设为 true。 Whether this column should be sticky positioned on the end of the row. Should make sure that it mimics the `CanStick` mixin such that `_hasStickyChanged` is set to true if the value has been changed.
`cssClassFriendlyName: string`	列名的转换后版本，可以作为 CSS 类名的一部分。只允许字母、数字和两个特殊字符 “-” 和 “_”。除此之外的字符都会替换为 “-”。 Transformed version of the column name that can be used as part of a CSS classname. Excludes all non-alphanumeric characters and the special characters '-' and '_'. Any characters that do not match are replaced by the '-' character.

方法

hasStickyChanged

hasStickyChanged
此粘性组件的值是否自上次调用后发生了变化。 Whether the sticky value has changed since this was last called.
`boolean`

此粘性组件的值是否自上次调用后发生了变化。

Whether the sticky value has changed since this was last called.

返回值

Returns

boolean

resetStickyChanged
对于粘性状态已被使用且未经检查的情况，重置脏检查。 Resets the dirty check for cases where the sticky state has been used without checking.

resetStickyChanged

对于粘性状态已被使用且未经检查的情况，重置脏检查。

Resets the dirty check for cases where the sticky state has been used without checking.

`CdkHeaderCell` extends BaseCdkCell

用于添加正确的类和角色的表头单元格模板容器。

Header cell template container that adds the right classes and role.

选择器： cdk-header-cell th[cdk-header-cell]

`CdkFooterCell` extends BaseCdkCell

用于添加正确的类和角色的表尾单元格模板容器。

Footer cell template container that adds the right classes and role.

选择器： cdk-footer-cell td[cdk-footer-cell]

`CdkCell` extends BaseCdkCell

用于添加正确的类和角色的单元格模板容器。

Cell template container that adds the right classes and role.

选择器： cdk-cell td[cdk-cell]

`CdkHeaderRowDef`

CDK 表格的表头行定义。存放表头行的模板和其他标题属性，比如要显示的列。

Header row definition for the CDK table. Captures the header row's template and other header properties such as the columns to display.

选择器： [cdkHeaderRowDef]

属性

名称描述

名称	描述
@Input( cdkHeaderRowDef) `columns: Iterable<string>`	要在行上显示的列。 The columns to be displayed on this row.
@Input( cdkHeaderRowDefSticky) `sticky: boolean`	是否应该使用粘性定位。 Whether sticky positioning should be applied.

@Input( cdkHeaderRowDef)

columns: Iterable<string>

要在行上显示的列。

The columns to be displayed on this row.

@Input( cdkHeaderRowDefSticky)

sticky: boolean

是否应该使用粘性定位。

Whether sticky positioning should be applied.

方法

extractCellTemplate
从提供的列定义中获取对此行的定义有用的相关单元格模板。 Gets this row def's relevant cell template from the provided column def.
参数 Parameters
column `CdkColumnDef`
返回值 Returns
`TemplateRef<any>`

getColumnsDiff

getColumnsDiff
返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。 Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.
`IterableChanges<any> \| null`

返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。

Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.

返回值

Returns

IterableChanges<any> | null

hasStickyChanged

hasStickyChanged
此粘性组件的值是否自上次调用后发生了变化。 Whether the sticky value has changed since this was last called.
`boolean`

此粘性组件的值是否自上次调用后发生了变化。

Whether the sticky value has changed since this was last called.

返回值

Returns

boolean

resetStickyChanged
对于粘性状态已被使用且未经检查的情况，重置脏检查。 Resets the dirty check for cases where the sticky state has been used without checking.

resetStickyChanged

对于粘性状态已被使用且未经检查的情况，重置脏检查。

Resets the dirty check for cases where the sticky state has been used without checking.

`CdkFooterRowDef`

CDK 表的表尾行定义，存放表尾行的模板和其他表尾属性，比如要显示的列。

Footer row definition for the CDK table. Captures the footer row's template and other footer properties such as the columns to display.

选择器： [cdkFooterRowDef]

属性

名称描述

名称	描述
@Input( cdkFooterRowDef) `columns: Iterable<string>`	要在行上显示的列。 The columns to be displayed on this row.
@Input( cdkFooterRowDefSticky) `sticky: boolean`	是否应该使用粘性定位。 Whether sticky positioning should be applied.

@Input( cdkFooterRowDef)

columns: Iterable<string>

要在行上显示的列。

The columns to be displayed on this row.

@Input( cdkFooterRowDefSticky)

sticky: boolean

是否应该使用粘性定位。

Whether sticky positioning should be applied.

方法

extractCellTemplate
从提供的列定义中获取对此行的定义有用的相关单元格模板。 Gets this row def's relevant cell template from the provided column def.
参数 Parameters
column `CdkColumnDef`
返回值 Returns
`TemplateRef<any>`

getColumnsDiff

getColumnsDiff
返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。 Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.
`IterableChanges<any> \| null`

返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。

Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.

返回值

Returns

IterableChanges<any> | null

hasStickyChanged

hasStickyChanged
此粘性组件的值是否自上次调用后发生了变化。 Whether the sticky value has changed since this was last called.
`boolean`

此粘性组件的值是否自上次调用后发生了变化。

Whether the sticky value has changed since this was last called.

返回值

Returns

boolean

resetStickyChanged
对于粘性状态已被使用且未经检查的情况，重置脏检查。 Resets the dirty check for cases where the sticky state has been used without checking.

resetStickyChanged

对于粘性状态已被使用且未经检查的情况，重置脏检查。

Resets the dirty check for cases where the sticky state has been used without checking.

`CdkRowDef` extends BaseRowDef

CDK 表的数据行定义。存放数据行的模板和其他行属性，比如要显示的列和描述何时应该使用该行的谓词。

Data row definition for the CDK table. Captures the header row's template and other row properties such as the columns to display and a when predicate that describes when this row should be used.

选择器： [cdkRowDef]

属性

名称描述

名称	描述
@Input( cdkRowDefColumns) `columns: Iterable<string>`	要在行上显示的列。 The columns to be displayed on this row.
@Input( cdkRowDefWhen) `when: (index: number, rowData: T) => boolean`	如果要把这个行模板用于所提供的索引和行数据，该函数应返回 true。如果未定义，那么当该函数对该数据返回 true 时，该行将被认为是默认的行模板。对于每一行，必须至少有一个函数能通过或者为 undefined 以便作为默认值。 Function that should return true if this row template should be used for the provided index and row data. If left undefined, this row will be considered the default row template to use when no other when functions return true for the data. For every row, there must be at least one when function that passes or an undefined to default.

@Input( cdkRowDefColumns)

columns: Iterable<string>

要在行上显示的列。

The columns to be displayed on this row.

@Input( cdkRowDefWhen)

when: (index: number, rowData: T) => boolean

如果要把这个行模板用于所提供的索引和行数据，该函数应返回 true。如果未定义，那么当该函数对该数据返回 true 时，该行将被认为是默认的行模板。对于每一行，必须至少有一个函数能通过或者为 undefined 以便作为默认值。

Function that should return true if this row template should be used for the provided index and row data. If left undefined, this row will be considered the default row template to use when no other when functions return true for the data. For every row, there must be at least one when function that passes or an undefined to default.

方法

extractCellTemplate
从提供的列定义中获取对此行的定义有用的相关单元格模板。 Gets this row def's relevant cell template from the provided column def.
参数 Parameters
column `CdkColumnDef`
返回值 Returns
`TemplateRef<any>`

getColumnsDiff

getColumnsDiff
返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。 Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.
`IterableChanges<any> \| null`

返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。

Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.

返回值

Returns

IterableChanges<any> | null

`CdkHeaderRow`

包含单元格出口的头模板容器。添加合适的类和角色。

Header template container that contains the cell outlet. Adds the right class and role.

选择器： cdk-header-row tr[cdk-header-row]

`CdkFooterRow`

包含单元格出口的表尾模板容器。添加合适的类和角色。

Footer template container that contains the cell outlet. Adds the right class and role.

选择器： cdk-footer-row tr[cdk-footer-row]

`CdkRow`

包含单元格出口的数据行模板容器。添加合适的类和角色。

Data row template container that contains the cell outlet. Adds the right class and role.

选择器： cdk-row tr[cdk-row]

`CdkNoDataRow`

当表中没有数据时，可以用来显示一条消息的行。

Row that can be used to display a message when no data is shown in the table.

选择器： ng-template[cdkNoDataRow]

属性

名称	描述
`templateRef: TemplateRef<any>`

`CdkTextColumn`

只显示表头行和行单元格的文本内容的列。假设该表正在使用原生表格实现（ <table> ）。

Column that simply shows text content for the header and row cells. Assumes that the table is using the native table implementation (<table>).

默认情况下，该列的名称就是表头文本和数据属性访问器。输入属性 headerText 可以改写表头文本。输入属性 dataAccessor 可以改写单元格的值。输入属性 justify 把文本对齐方式修改为对齐到开头或结尾。

By default, the name of this column will be the header text and data property accessor. The header text can be overridden with the headerText input. Cell values can be overridden with the dataAccessor input. Change the text justification to the start or end using the justify input.

选择器： cdk-text-column

属性

名称	描述
@Input() `dataAccessor: (data: T, name: string) => string`	访问器函数用来检索为要每个单元格渲染的数据。如果未设置此属性，数据单元格将渲染数据属性中与该列名匹配的值。例如，如果列的名字是 `id` ，那么渲染的值就是 data 的 `id` 属性定义的值。 Accessor function to retrieve the data rendered for each cell. If this property is not set, the data cells will render the value found in the data's property matching the column's name. For example, if the column is named `id`, then the rendered value will be value defined by the data's `id` property.
@Input() `headerText: string`	要作为列表头的文本标签。如果未设置此属性，则表头文本默认使用列名的首字母大写形式。 Text label that should be used for the column header. If this property is not set, the header text will default to the column name with its first letter capitalized.
@Input() `justify: 'start' \| 'end'`	单元格中值的对齐方式。 Alignment of the cell values.
@Input() `name: string`	要用来引用这个列的列名。 Column name that should be used to reference this column.

类

`BaseCdkCell`

单元格的基类。添加一个 CSS 类名来标识它所渲染的列。

Base class for the cells. Adds a CSS classname that identifies the column it renders in.

`BaseRowDef`

CdkHeaderRowDef 和 CdkRowDef 的基类，负责处理各列的输入变更并通知表格。

Base class for the CdkHeaderRowDef and CdkRowDef that handles checking their columns inputs for changes and notifying the table.

属性

名称描述

名称	描述
`columns: Iterable<string>`	要在行上显示的列。 The columns to be displayed on this row.

columns: Iterable<string>

要在行上显示的列。

The columns to be displayed on this row.

方法

extractCellTemplate
从提供的列定义中获取对此行的定义有用的相关单元格模板。 Gets this row def's relevant cell template from the provided column def.
参数 Parameters
column `CdkColumnDef`
返回值 Returns
`TemplateRef<any>`

getColumnsDiff

getColumnsDiff
返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。 Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.
`IterableChanges<any> \| null`

返回当前列和最后一个差分过的列之间的差异，如果没有差别，则返回 null。

Returns the difference between the current columns and the columns from the last diff, or null if there is no difference.

返回值

Returns

IterableChanges<any> | null

接口

`RowOutlet`

本接口用来为要插入的行提供出口地标。

Interface used to provide an outlet for rows to be inserted into.

属性

名称	描述
`viewContainer: ViewContainerRef`

`CellDef`

用于单元格定义的基本接口。存放列的单元格模板定义。

Base interface for a cell definition. Captures a column's cell template definition.

属性

名称	描述
`template: TemplateRef<any>`

`CdkCellOutletRowContext`

当 multiTemplateDataRows 为 false 时，提供给行单元格的上下文

Context provided to the row cells when multiTemplateDataRows is false

属性

名称	描述
`$implicit: T`	该单元格所在行的数据。 Data for the row that this cell is located within.
`count: number`	总行数的长度。 Length of the number of total rows.
`even: boolean`	如果此单元格包含在具有偶数索引的行中，则返回 true。 True if this cell is contained in a row with an even-numbered index.
`first: boolean`	如果此单元格包含在第一行，则为 True。 True if this cell is contained in the first row.
`index: number`	数据对象在所提供的数据组中的索引。 Index of the data object in the provided data array.
`last: boolean`	如果此单元格包含在最后一行，则为 True。 True if this cell is contained in the last row.
`odd: boolean`	如果此单元格包含在具有奇数索引的行中，则返回 true。 True if this cell is contained in a row with an odd-numbered index.

`CdkCellOutletMultiRowContext`

multiTemplateDataRows 为 true 时，提供给行单元格的上下文。这个上下文与 CdkCellOutletRowContext 相同，除非单个的 index 值被置换为了 dataIndex 和 renderIndex。

Context provided to the row cells when multiTemplateDataRows is true. This context is the same as CdkCellOutletRowContext except that the single index value is replaced by dataIndex and renderIndex.

属性

名称	描述
`$implicit: T`	该单元格所在行的数据。 Data for the row that this cell is located within.
`count: number`	总行数的长度。 Length of the number of total rows.
`dataIndex: number`	数据对象提供的数据对象索引。 Index of the data object in the provided data array.
`even: boolean`	如果此单元格包含在具有偶数索引的行中，则返回 true。 True if this cell is contained in a row with an even-numbered index.
`first: boolean`	如果此单元格包含在第一行，则为 True。 True if this cell is contained in the first row.
`last: boolean`	如果此单元格包含在最后一行，则为 True。 True if this cell is contained in the last row.
`odd: boolean`	如果此单元格包含在具有奇数索引的行中，则返回 true。 True if this cell is contained in a row with an odd-numbered index.
`renderIndex: number`	该单元格所在的渲染行的索引位置。 Index location of the rendered row that this cell is located within.

`StickyUpdate`

属性

名称	描述
`sizes: StickySize[]`

`StickyPositioningListener`

如果提供的话，CdkTable 在更新其粘性行和列的大小/位置等时会调用下面的方法。

If provided, CdkTable will call the methods below when it updates the size/ postion/etc of its sticky rows and columns.

方法

stickyColumnsUpdated

stickyColumnsUpdated
当 CdkTable 更新其粘性首列时调用。 Called when CdkTable updates its sticky start columns.
update `StickyUpdate`

当 CdkTable 更新其粘性首列时调用。

Called when CdkTable updates its sticky start columns.

参数

Parameters

update

StickyUpdate

stickyEndColumnsUpdated

stickyEndColumnsUpdated
当 CdkTable 更新其粘性末列时调用。 Called when CdkTable updates its sticky end columns.
update `StickyUpdate`

当 CdkTable 更新其粘性末列时调用。

Called when CdkTable updates its sticky end columns.

参数

Parameters

update

StickyUpdate

stickyFooterRowsUpdated

stickyFooterRowsUpdated
当 CdkTable 更新其粘性表尾行时调用。 Called when CdkTable updates its sticky footer rows.
update `StickyUpdate`

当 CdkTable 更新其粘性表尾行时调用。

Called when CdkTable updates its sticky footer rows.

参数

Parameters

update

StickyUpdate

stickyHeaderRowsUpdated

stickyHeaderRowsUpdated
当 CdkTable 更新其粘性表头行时调用。 Called when CdkTable updates its sticky header rows.
update `StickyUpdate`

当 CdkTable 更新其粘性表头行时调用。

Called when CdkTable updates its sticky header rows.

参数

Parameters

update

StickyUpdate

`TextColumnOptions`

CdkTextColumn 配置选项。

Configurable options for CdkTextColumn.

属性

名称描述

名称	描述
`defaultDataAccessor: (data: T, name: string) => string`	默认数据访问器，如果一个都没有提供过，就用它。 Default data accessor to use if one is not provided.
`defaultHeaderTextTransform: (name: string) => string`	默认函数，如果没有提供表头文本，它就会根据列名提供表头文本。 Default function that provides the header text based on the column name if a header text is not provided.

defaultDataAccessor: (data: T, name: string) => string

默认数据访问器，如果一个都没有提供过，就用它。

Default data accessor to use if one is not provided.

defaultHeaderTextTransform: (name: string) => string

默认函数，如果没有提供表头文本，它就会根据列名提供表头文本。

Default function that provides the header text based on the column name if a header text is not provided.

类型别名

`StickyDirection`

type StickyDirection = 'top' | 'bottom' | 'left' | 'right';

`StickySize`

type StickySize = number | null | undefined;

常量

`CDK_ROW_TEMPLATE`

供 mat-table 使用的行模板。不应该在 Material 库之外使用。

The row template that can be used by the mat-table. Should not be used outside of the material library.

const CDK_ROW_TEMPLATE: "<ng-container cdkCellOutlet></ng-container>";

`STICKY_POSITIONING_LISTENER`

这个注入令牌用来指定 StickyPositioningListener。

The injection token used to specify the StickyPositioningListener.

const STICKY_POSITIONING_LISTENER: InjectionToken<StickyPositioningListener>;

`TEXT_COLUMN_OPTIONS`

这个注入令牌可以用来指定文本列的选项。

Injection token that can be used to specify the text column options.

const TEXT_COLUMN_OPTIONS: InjectionToken<TextColumnOptions<any>>;

Angular CDK table API 参考文档

link 指令

link CdkTable

属性

方法

link CdkCellDef

link CdkHeaderCellDef

link CdkFooterCellDef

link CdkColumnDef

属性

方法

link CdkHeaderCell extends BaseCdkCell

link CdkFooterCell extends BaseCdkCell

link CdkCell extends BaseCdkCell

link CdkHeaderRowDef

属性

方法

link CdkFooterRowDef

属性

方法

link CdkRowDef extends BaseRowDef

属性

方法

link CdkHeaderRow

link CdkFooterRow

link CdkRow

link CdkNoDataRow

属性

link CdkTextColumn

属性

link 类

link BaseCdkCell

link BaseRowDef

属性

方法

link 接口

link RowOutlet

属性

link CellDef

属性

link CdkCellOutletRowContext

属性

link CdkCellOutletMultiRowContext

属性

link StickyUpdate

属性

link StickyPositioningListener

方法

link TextColumnOptions

属性

link 类型别名

link StickyDirection

link StickySize

link 常量

link CDK_ROW_TEMPLATE

link STICKY_POSITIONING_LISTENER

link TEXT_COLUMN_OPTIONS

指令

`CdkTable`

`CdkCellDef`

`CdkHeaderCellDef`

`CdkFooterCellDef`

`CdkColumnDef`

`CdkHeaderCell` extends BaseCdkCell

`CdkFooterCell` extends BaseCdkCell

`CdkCell` extends BaseCdkCell

`CdkHeaderRowDef`

`CdkFooterRowDef`

`CdkRowDef` extends BaseRowDef

`CdkHeaderRow`

`CdkFooterRow`

`CdkRow`

`CdkNoDataRow`

`CdkTextColumn`

类

`BaseCdkCell`

`BaseRowDef`

接口

`RowOutlet`

`CellDef`

`CdkCellOutletRowContext`

`CdkCellOutletMultiRowContext`

`StickyUpdate`

`StickyPositioningListener`

`TextColumnOptions`

类型别名

`StickyDirection`

`StickySize`

常量

`CDK_ROW_TEMPLATE`

`STICKY_POSITIONING_LISTENER`

`TEXT_COLUMN_OPTIONS`