Angular 自定义材质表组件上的捕获排序事件（角度6）

基于几天的研究和多种来源的组合以及其他人的帮助，我构建了这个定制的表组件，我可以将它用于所有已经内置了所有基础知识的表。 创建表所需要做的就是定义列并传入数据

但是现在我想添加一个选项来记住使用cookies对每个用户进行排序，如果我在使用自定义表组件的页面上捕捉到排序事件，我就可以这样做，但是这违背了自定义组件的目的，如果我能在自定义组件中捕捉到排序事件，那么它会更干净

使用自定义组件创建表的示例：

<dyn-table [data]="users" [displayedColumns]="displayedColumns" matSort (matSortChange)="sortChange($event)">
    <dyn-col name="user_id"></dyn-col>
    <dyn-col name="user_name"></dyn-col>
</dyn-table>

我需要一种方法来创建表，而不在此处添加

（matSortChange）=“sortChange（$event）”

，而是在自定义表组件中捕获sortChange

StackBlitz使用自定义表组件捕获app.component.ts中的事件（应该在dyn table.component.ts中捕获）。

---

看起来这应该是一个简单的例子，但我还没有找到解决方案。

如果您在自定义组件上操纵

matSort

指令，那么您可以使用

HostListener

装饰程序捕捉该事件：

dyn表.component.ts

@HostListener('matSortChange', ['$event'])
sortChange(e) {
  // save cookie with table sort data here
  console.log(e);
}

---

如果在自定义组件上操作

matSort

指令，则可以使用

HostListener

装饰器捕捉该事件：

dyn表.component.ts

@HostListener('matSortChange', ['$event'])
sortChange(e) {
  // save cookie with table sort data here
  console.log(e);
}