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

私が使用しているReactiveFormsModuleフォームが含まれているコンポーネントを作成するAngular2の。これが私のコードです： foo.component.ts： constructor(fb: FormBuilder) { this.myForm = fb.group({ 'fullname': ['', Validators.required], 'gender': [] }); } foo.component.html（と[formControl]）： <div class="fields"> <div class="field"> <label>Fullname*</label> <input type="text" [formControl]="myForm.controls.fullname"/> </div> </div> <div class="inline fields"> <label for="gender">Gender</label> <div class="field"> <div class="ui radio checkbox"> <input type="radio" name="gender" checked="" tabindex="0" class="hidden" [formControl]="myForm.controls.gender"> <label>Male</label> </div> </div> <div class="field"> <div …

97 angular  radio-button  angular2-forms  form-control  angular2-formbuilder 

RC5にアップグレードした後、次のエラーが発生し始めました。 ngModel cannot be used to register form controls with a parent formGroup directive. Try using formGroup's partner directive "formControlName" instead. Example: <div [formGroup]="myGroup"> <input formControlName="firstName"> </div> In your class: this.myGroup = new FormGroup({ firstName: new FormControl() }); Or, if you'd like to avoid registering this form control, indicate that …

93 angular  angular2-forms  angular2-formbuilder 

すべてのフォームのフィールドをタッチ済みとしてマークする方法を見つけるのに苦労しています。主な問題は、フィールドに触れずにフォームを送信しようとすると、検証エラーが表示されないことです。コントローラにそのコードのプレースホルダーがあります。 私の考えは単純です： ユーザーが送信ボタンをクリックする すべてのフィールドがタッチ済みとしてマークされます エラーフォーマッタが再実行され、検証エラーが表示されます 新しい方法を実装せずに、送信時にエラーを表示する方法について他のアイデアがある場合は、それらを共有してください。ありがとう！ 私の簡略化された形式： <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