問題タブ [angular4-forms]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angular - ラジオ ボタンの選択に応じてフィールドに入力するテンプレート ベースのフォームを使用したラジオ ボタンのバインディング
私は3つのラジオボタンを持つフォームを持っています。最初の 1 つがデフォルトで選択されます。2 つ目は、クリックする条件付きで入力フィールドを表示する必要があります。そして、3 番目のオプションを選択すると、その入力フィールドに何らかの値が設定されます。
それらを順番にクリックすると(2番目、次に3番目)、正常に機能します。ただし、最初の 1 つが選択されているときに 3 番目を選択すると、フィールドは入力されません。
関連する解決策や質問を見つけようとしましたが、助けにはなりませんでした。
angular - ngModels を使用して、コンポーネントからビューへの配列を持つ Angular バインディング オブジェクト
モデルをビューにバインドしようとしましたが、フォームを送信するときに問題が発生しました。配列はありませんが、多くのプロパティがあります。
成分 :
私のテンプレート:
question.ts (モデル)
answer.ts (モデル)
初期オブジェクト:
送信後のコンソール:
送信後、最初のオブジェクトと同じもの (データが更新された同じ構造)、送信の前後で同じデータ構造が必要です
私は自分の見解でこれを試しましたが、うまくいきません:
*ngFor [ngModel]=question.answers[i].textを[ngModel]="answer.text"で変換しますが、同じ問題があります...
私はさまざまな投稿から多くのことを試しました:オブジェクト入力の配列を持つAngular 2フォーム、 NgForのNgModelを使用したAngular 2-2 Way Binding
ただし、常に多くのプロパティがあり、配列はありません
テンプレート駆動のみで、リアクティブフォームなしでこれを行いたい
デモ:
https://angular-by7uv1.stackblitz.io/
オブジェクト 'answer' とは異なる関数を使用したいと思います。たとえば、answer.getInformation()、getCount()、getInspectMyObject() などです。この関数は、ビューにクリーンなコードを表示するために、モデル 'Answer' によって提供されます。*ngFor で自分のモデルの多くの関数を使用したいと思います。リアクティブ フォームを使用すると、親オブジェクトと子オブジェクトの間の「リンク」が壊れているため、モデルとは異なる関数を使用できません。
解決した
angular - angular 4/6/7のフォーム送信ですべてのチェックボックスの値を渡す方法
change()
すでにチェックされているアイテムを取得できないため、使用またはclick()
関数を使用せずに、コンポーネント内のフォームのチェックされたすべてのアイテムを取得したいと考えています。
TS の配列は次のとおりです。
私のHTMLフォーム:
チェックされたすべての値を取得したい onSubmit 関数: