タグ付けされた質問 「angular2-forms」

FormGroup： A FormGroupはキーとして各コントロール名と、1つのオブジェクトに各子FormControlの値を集約します。 const form = new FormGroup({ first: new FormControl('Nancy', Validators.minLength(2)), last: new FormControl('Drew') }); FormArray： A FormArrayは配列に各子FormControlの値を集約します。 const arr = new FormArray([ new FormControl('Nancy', Validators.minLength(2)), new FormControl('Drew') ]); いつ一方を他方の上に使用する必要がありますか？

91 angular  angular2-forms  angular-reactive-forms 

そのため、エンティティを作成するための複雑なフォームがあり、それを編集にも使用したいと思います。新しい角度フォームAPIを使用しています。データベースから取得したデータとまったく同じようにフォームを構造化したので、フォーム全体の値をここで取得したデータに設定したいのは、私がやりたいことの例です。 this.form = builder.group({ b : [ "", Validators.required ], c : [ "", Validators.required ], d : [ "" ], e : [ [] ], f : [ "" ] }); this.form.value({b:"data",c:"data",d:"data",e:["data1","data2"],f:data}); PS：NgModelは新しいフォームAPIでは機能しません。また、テンプレートで一方向のデータバインディングを使用してもかまいません。 <input formControlName="d" value="[data.d]" /> それは機能しますが、アレイの場合は面倒です

91 angular  angular2-forms 

テンプレート付きの単純なAngular2コンポーネントがいくつかあります。送信後にフォームとすべてのフィールドをクリアする方法は？ページをリロードできません。date.setValue('')フィールドを設定した後のデータはstiltouchedです。 import {Component} from 'angular2/core'; import {FORM_DIRECTIVES, FormBuilder, ControlGroup, Validators, Control} from 'angular2/common'; @Component({ selector: 'loading-form', templateUrl: 'app/loadings/loading-form.component.html', directives: [FORM_DIRECTIVES] }) export class LoadingFormComponent { private form:ControlGroup; private date:Control; private capacity:Control; constructor(private _loadingsService:LoadingsService, fb:FormBuilder) { this.date = new Control('', Validators.required); this.capacity = new Control('', Validators.required); this.form = fb.group({ 'date': this.date, …

88 angular  angular2-forms 

すべてのフォームのフィールドをタッチ済みとしてマークする方法を見つけるのに苦労しています。主な問題は、フィールドに触れずにフォームを送信しようとすると、検証エラーが表示されないことです。コントローラにそのコードのプレースホルダーがあります。 私の考えは単純です： ユーザーが送信ボタンをクリックする すべてのフィールドがタッチ済みとしてマークされます エラーフォーマッタが再実行され、検証エラーが表示されます 新しい方法を実装せずに、送信時にエラーを表示する方法について他のアイデアがある場合は、それらを共有してください。ありがとう！ 私の簡略化された形式： <form class="form-horizontal" [formGroup]="form" (ngSubmit)="onSubmit(form.value)"> <input type="text" id="title" class="form-control" formControlName="title"> <span class="help-block" *ngIf="formErrors.title">{{ formErrors.title }}</span> <button>Submit</button> </form> そして私のコントローラー： import {Component, OnInit} from '@angular/core'; import {FormGroup, FormBuilder, Validators} from '@angular/forms'; @Component({ selector : 'pastebin-root', templateUrl: './app.component.html', styleUrls : ['./app.component.css'] }) export class AppComponent implements OnInit …

88 angular  angular-reactive-forms  angular2-forms  angular2-formbuilder 

FormBuilder内にフォーム配列があり、フォームを動的に変更しています。つまり、アプリケーション1からデータをロードするなどです。 私が抱えている問題は、すべてのデータが読み込まれるが、FormArrayのデータは残り、古いアイテムを新しいアイテムと連結するだけであるということです。 そのFormArrayをクリアして、新しいアイテムのみを含めるにはどうすればよいですか。 私はこれを試しました const control2 = <FormArray>this.registerForm.controls['other_Partners']; control2.setValue([]); しかし、それは機能しません。 何か案は？ ngOnInit(): void { this.route.params.subscribe(params => { if (params['id']) { this.id = Number.parseInt(params['id']); } else { this.id = null;} }); if (this.id != null && this.id != NaN) { alert(this.id); this.editApplication(); this.getApplication(this.id); } else { this.newApplication(); } } onSelect(Editedapplication: Application) …

87 angular  angular2-forms 

プログラムで要素に対してクリックイベント（またはその他のイベント）を発生させようとしています。言い換えると、angular2のjQuery .trigger（）メソッドによって提供されるのと同様の機能を知りたいのです。 これを行うための組み込みメソッドはありますか？.....そうでない場合は、どうすればこれを行うことができますかを提案してください 次のコードフラグメントを検討してください <form [ngFormModel]="imgUploadFrm" (ngSubmit)="onSubmit(imgUploadFrm)"> <br> <div class="input-field"> <input type="file" id="imgFile" (click)="onChange($event)" > </div> <button id="btnAdd" type="submit" (click)="showImageBrowseDlg()" )>Add Picture</button> </form> ここでは、ユーザーがクリックしたときbtnAddを、それが上のクリックイベント発動すべきであるimgFileを

82 angular  angular2-forms