web-dev-qa-db-ja.com

angular 2バージョン6でMatTableDataSourceを更新する正しい方法

MatTableDataSourceによって供給されるマットテーブルコンポーネントを使用するリストがあります。

component.html

<table mat-table [dataSource]="dataSource" matSort>

component.ts

dataSource = new MatTableDataSource();

アイテムをクリックして削除すると、サーバーからの成功コールバックで、MatTableDataSource（this.resources）を再インスタンス化して新しい結果セットを反映するようにリストを更新し、そのように新しい結果セットを渡します。これは機能します...

this.PHService.getResources().subscribe(resources => {
  this.resources = resources;
  this.dataSource = new MatTableDataSource(this.resources);
  this.dataSource.sort = this.sort;
});

しかし、これはうまくいきましたが、間違っていると感じています。

データソースを拡張する必要があると述べている記事をいくつか読んだことがありますか？そしてrenderRows（）メソッドを呼び出しますか？私はこれを試してみましたが、私のシナリオではうまく機能していないようです。

私には理解が足りないことがわかっています。

どんな助け/アドバイスでも大歓迎です。

前もって感謝します。

angularangular-material-6mat-table
6
Adamski

@ViewChildプロパティデコレータを使用してChangeDetectorRefsサービスを挿入する必要をなくす、より良い方法を見つけました。

以下はコード例です。

@ViewChild(MatTable) table: MatTable<any>;

次に、そのプロパティデコレータでrenderRows（）メソッドを呼び出すだけです。以下に例を示します。

  refresh(): void{
    this.service.method().subscribe(resources => {
      this.dataSource.data = resources; 
      this.dataSource.sort = this.sort;
      this.dataSource.paginator = this.paginator;
    });
    this.table.renderRows();
  }

これは私がこれまでに機能することを思いついたこれに対する最良の解決策です。

Angular Material 6.4.7。

お役に立てれば。

2
Adamski