web-dev-qa-db-ja.com

剣道:FormGroupの上部にあるFormGroupを挿入する

問題ステートメント:

以下のstackblitzデモでは、FormGroupボタンをクリックしてグリッドの最初に動的にAddを挿入し、1つのコントロールから(blur)イベントをトリガーして値を更新できます同じrowIndexを共有する別のコントロールの。ここで問題は、複数のformGroupsを挿入し、新しく追加されたFormGroups(blur)イベントでトリガーすると、他のコントロールの値が更新され、異なるrowIndex

問題を再現する手順:

  • 以下のデモリンクを開きます。
  • [追加]ボタンをクリックして、複数の行(2行)を追加します。
  • 新しく追加された2行目の名前フィールドに値を入力して、フォーカスを外します。
  • 2番目の行だけではなく、新しく追加された行の両方で年齢フィールドを更新します。

Stackblitzデモ:https://stackblitz.com/edit/angular-oitz5j-4uezqr

要件:

特定の行の名前フィールドをタブで表示します。同じ行の年齢フィールドは、他の行に影響を与えることなく乱数を表示する必要があります。

これまでに試したことは何ですか?

  • Array nshift() メソッドを使用しようとしましたが、エラーが発生しました

    プロパティ 'unshift'はタイプ 'FormArray'に存在しません

  • FormArray.insert() メソッドを使用しようとしました。特定のインデックスにFormGroupを追加する場合に機能します。ただし、動的にFormGroupsの上に複数のFormArrayを挿入することはできません。

Update:上記の問題は、Kendo Gridがなくても正常に機能します。以下のデモを確認してください。

デモ:https://stackblitz.com/edit/angular-oitz5j-2a31gs

github/stackoverflowの関連する問題:

https://github.com/angular/angular/issues/16322

角度-フォーム配列プッシュ固有のインデックス

注:グリッドの最後にコントロールを追加する場合、それはチャンプのように機能します。最後にコントロールを追加することでうまく機能する以下のデモを確認してください。

デモ:https://stackblitz.com/edit/angular-oitz5j-aszrjq

12
Rohit Jindal

問題は剣道グリッドです。そのデータソースのインデックス0を何度も繰り返しており、データを表示するために内部的に何を行うかを誰が知っているか。しかし、本当のことは、フォーム配列値を使用しないことです。剣道グリッドの配列から抜け出すと問題なく動作するか、onFocusOutメソッドの最後にコンソールログconsole.log(this.createForm.get("items").value);を追加すると、formArrayの値が問題ないことがわかります。

はいまたははい剣道グリッドを使用する必要がある場合。次のドキュメントを読んでください。

https://www.telerik.com/kendo-angular-ui/components/grid/editing/editing-reactive-forms/

私が目にする例は、フォームを外部で処理できないことを示しています。剣道グリッドが提供するメソッドを使用する必要があります。剣道グリッドはfromArray値を実際には表示しないため

0
Manuel Panizzo