我正在寻找使用角度材料创建动态表，我可以在其中动态添加/删除数据。作为 Angular 的新手，我参考了 stackblitz 来创建表格。

htt,angular,typescript"/>

时间戳

首页 > 解决方案 > TS2339：“行为主题”类型上不存在属性“排序”

我正在寻找使用角度材料创建动态表，我可以在其中动态添加/删除数据。作为 Angular 的新手，我参考了 stackblitz 来创建表格。

htt

angular - TS2339：“行为主题”类型上不存在属性“排序”

我正在寻找使用角度材料创建动态表，我可以在其中动态添加/删除数据。作为 Angular 的新手，我参考了 stackblitz 来创建表格。

htt

问题描述

我正在寻找使用角度材料创建动态表，我可以在其中动态添加/删除数据。作为 Angular 的新手，我参考了 stackblitz 来创建表格。

https://stackblitz.com/edit/angular-material-editable-table-fazhbc

虽然我的所有更改都有效 - 我无法对数据进行排序

 ngAfterViewInit() {
    this.dataSource.sort = this.matSort;
  }

我得到 TS2339 的错误：类型上不存在属性“排序”'BehaviorSubject<AbstractControl[]

是不是像材料表数据源那样支持排序，还是我遗漏了什么？

您也可以使用rxjsfromEventPattern中的函数。

  private createOnClickObservable(renderer: Renderer2) {
    let removeClickEventListener: () => void;
    const createClickEventListener = (
      handler: (e: Event) => boolean | void
    ) => {
      removeClickEventListener = renderer.listen("document", "click", handler);
    };

    this.onClick$ = fromEventPattern<Event>(createClickEventListener, () =>
      removeClickEventListener()
    ).pipe(takeUntil(this._destroy$));
  }

只需按预期使用/订阅它

   myMouseService.onClick$.subscribe((e: Event) => {
      console.log("CLICK", e);
    });

并且不用担心破坏，它会在关闭 observable 时由 rxjs 处理！

现场演示：https ://stackblitz.com/edit/angular-so4?file=src%2Fapp%2Fmy-mouse.service.ts

查看另一个答案，了解更多详细信息：Is it possible to use HostListener in a Service? 或者如何在 Angular 服务中使用 DOM 事件？

标签： angulartypescript

解决方案

您需要使用valueor从 BehaviorSubject 获取当前值，getValue()并将其排序如下：this.dataSource.value.sort(this.matSort)。

推荐阅读