matSort 和 mat-sort-header 用于为表格型数据添加排序状态并显示出来。

为表头添加排序功能

要想为表头添加排序行为和样式，请把 <mat-sort-header> 组件添加到每个表头中，并提供一个 id 来标识它。 这些表头应该包含在一个带有 matSort 指令的父元素中，当用户在表头上触发排序时，该指令将会发出一个 matSortChange 事件。

用户可以通过鼠标点击或键盘动作来为表头触发排序。这时，matSort 就会发出一个 matSortChange 事件，其中包含触发排序的表头和排序的方向（asc 或 desc）。

修改排序方向

默认情况下，排序表头的排序方向先从 asc 开始，再点就变成 desc，再点一次则会移除排序。

要想逆转所有表头的排序顺序，请把 matSort 指令的 matSortStart 属性设置为 desc。 如果要对某个特定的表头逆转排序顺序，请设置那个表头自身的输入属性 start。

要想阻止该用户从已经排序的列上清除排序状态，请把 matSort 的 matSortDisableClear 属性设置为 true 来影响所有表头，如果只想针对特定的表头，请把该表头的 disableClear 设置为 true。

禁用排序

如果你要阻止用户修改所有列的排序状态，可以绑定 mat-sort 的 matSortDisabled 属性；如果只想针对单个 mat-sort-header，请绑定它的 disabled 属性。

在 mat-table 上使用排序

当使用 mat-table 中的表头时，不需要为它设置 mat-sort-header，因为默认情况下它将会使用列本身的 id。

无障碍性

当你将 MatSortHeader 应用于标题单元格元素时，该组件会将标题单元格的内容包装在按钮内。然后标题单元格的文本内容就会成为排序按钮的无障碍标签。但是，标题单元格文本通常会描述列，而不会用来与控件交互执行排序操作。要清楚地表达标题如何执行排序，请始终使用输入属性 sortActionDescription 来提供按钮元素的描述，例如“按姓氏排序”。

MatSortHeader 应用 aria-sort 属性将当前排序状态传达给辅助技术。但是，大多数屏幕阅读器不会播报 aria-sort 值的更改，这意味着屏幕阅读器用户不会收到排序发生的反馈。要解决此问题，请使用 MatSort 指令上的 matSortChange 事件通过来自 @angular/cdk/a11y 的 LiveAnnouncer 服务播报本次状态更新。

如果你的应用程序包含许多表和排序标头，请考虑创建自定义指令以一致地应用 sortActionDescription 并播报排序状态更改。