問題タブ [mat-autocomplete]

mat-table 内に mat-autocomplete コントロール (ほぼ 30k レコード) をバインドしています。ここで、ユーザーはオートコンプリートで値を変更し、マットテーブルを保存できます。

ユーザーがマットテーブルの複数の行でオートコンプリートコントロールで異なる値を選択して保存した場合。

mat-table を再バインドすると、mat-autocomplete で選択したすべての項目が mat-autocomplete の最後の値で表示されます。

しかし、ここではデータ ソース オブジェクトが適切に更新されています。

mat-autocomplete で値を更新して保存する

マットテーブル設定の最後の値を更新した後。[ここでは、データ ソースは問題なく、正しい値を持つ json オブジェクトです]

HTMLコード

マットテーブルはコンテナに配置され、タブコントロールに配置され、タブページをクリックすると、マットテーブルをロードしてバインドします

ページに 2 つの mat-autocomplete ビューがあります。このために、この角材の例を使用しています。 https://stackblitz.com/angular/lnnnrgqxjmd?file=app%2Fautocomplete-overview-example.ts この同じ例を使用しています。同じページに、APIからフェッチした後にデータを表示しているtable.forがあります。

1 つのオートコンプリート ビューで、すべての名前を入力しています。2 番目のオートコンプリート ビューでは、すべてのステータスを入力しています。

オートコンプリートから選択した名前とステータスに基づいて、このテーブルを検索したいと考えています。

誰でもこれを行う方法を教えてください。

mat-autocomplete を使用する入力を再設定しようとしています。ただし、値を送信してthis.optionForm.patchValue({selectedOption: 'my value'})も結果が GUI に表示されません。値console.log()が設定されていることがはっきりとわかります。この問題が、フィールドにオブジェクトを設定することもあれば、文字列だけを設定することもあるという事実に関係があるかどうかはわかりません。しかし、入力に結果を再入力して適切に表示できるようにしたいと考えています。どのように試しても、結果を表示できないようです。

以下は、問題の入力だけに切り詰められたコンポーネントと、の結果を取得している Observable ですmat-autocomplete。これらは、フォームが初めて使用されるときに正常に機能します。

どんな助けでも大歓迎です！