Setelah memutakhirkan ke RC5 kami mulai mendapatkan kesalahan ini:
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 it's standalone in ngModelOptions:
Example:
<div [formGroup]="myGroup">
<input formControlName="firstName">
<input [(ngModel)]="showMoreControls" [ngModelOptions]="{standalone: true}">
</div>
Sepertinya di RC5 keduanya tidak lagi dapat digunakan bersama, tetapi saya tidak dapat menemukan solusi alternatif.
Berikut adalah komponen yang menghasilkan pengecualian:
<select class="field form-control" [formGroup]="form" [(ngModel)]="cause.id" [name]="name">
<option *ngFor="let c of causes" [value]="c.text">{{c.text}}</option>
</select>
angular
angular2-forms
angular2-formbuilder
pengguna2363245
sumber
sumber
FormsModule
danReactiveFormsModule
?Jawaban:
Jawabannya tepat di pesan kesalahan, Anda perlu menunjukkan bahwa itu berdiri sendiri dan oleh karena itu tidak bertentangan dengan kontrol formulir:
sumber
Support for using the ngModel input property and ngModelChange event with reactive form directives has been deprecated in Angular v6 and will be removed in Angular v7.
https://next.angular.io/api/forms/FormControlName#use-with-ngmodelMemperluas jawaban @Avenir Çokaj
Menjadi seorang pemula bahkan saya tidak memahami pesan kesalahan dengan jelas pada awalnya.
Pesan kesalahan menunjukkan bahwa di formGroup Anda memiliki elemen yang tidak diperhitungkan di formControl Anda. (Sengaja / Tidak Sengaja)
Jika Anda bermaksud untuk tidak memvalidasi bidang ini tetapi masih ingin menggunakan ngModel pada elemen input ini, harap tambahkan bendera untuk menunjukkan bahwa itu adalah komponen mandiri tanpa perlu validasi seperti yang disebutkan oleh @Avenir di atas.
sumber
Oke, akhirnya berhasil: lihat https://github.com/angular/angular/pull/10314#issuecomment-242218563
Singkatnya, Anda tidak dapat lagi menggunakan
name
atribut dalam aformGroup
, dan harus menggunakanformControlName
sebagai gantinyasumber
ketika Anda menulis formcontrolname Angular 2 tidak menerima. Anda harus menulis formControlName . ini tentang kata kedua huruf besar.
Jika error masih berlanjut coba set form control untuk semua field objek (myObject).
antara awal
<form> </form>
misalnya:<form [formGroup]="myForm" (ngSubmit)="submitForm(myForm.value)"> set form control for all input field </form>.
sumber
import { FormControl, FormGroup, AbstractControl, FormBuilder, Validators } from '@angular/forms'; this.userInfoForm = new FormGroup({ userInfoUserName: new FormControl({ value: '' }, Validators.compose([Validators.required])), userInfoName: new FormControl({ value: '' }, Validators.compose([Validators.required])), userInfoSurName: new FormControl({ value: '' }, Validators.compose([Validators.required])) });
<form [formGroup]="userInfoForm" class="form-horizontal"> <div class="form-group"> <label class="control-label"><i>*</i> User Name</label> <input type="text" formControlName="userInfoUserName" class="form-control" [(ngModel)]="userInfo.userName"> </div> <div class="form-group"> <label class="control-label"><i>*</i> Name</label> <input type="text" formControlName="userInfoName" class="form-control" [(ngModel)]="userInfo.name"> </div> <div class="form-group"> <label class="control-label"><i>*</i> Surname</label> <input type="text" formControlName="userInfoSurName" class="form-control" [(ngModel)]="userInfo.surName"> </div> </form>
sumber
Saya perlu tahu mengapa ini terjadi di komponen tertentu dan bukan di komponen lain.
Masalahnya adalah saya memiliki 2 formulir dalam satu komponen dan formulir kedua belum ada
[formGroup]
dan belum terdaftar karena saya masih membuat formulir.Saya melanjutkan dan menyelesaikan penulisan kedua formulir lengkap tanpa meninggalkan masukan yang tidak terdaftar yang menyelesaikan masalah.
sumber
Saya baru saja mendapatkan kesalahan ini karena saya tidak menyertakan semua kontrol formulir saya dalam atribut
div
withformGroup
.Misalnya, ini akan memunculkan kesalahan
Ini bisa sangat mudah terlewatkan jika bentuknya sangat panjang.
sumber
Jika Anda ingin menggunakan
[formGroup]
withformControlName
, Anda harus menggantiname
atribut denganformControlNameformControlName
.Contoh:
Ini tidak berfungsi karena menggunakan atribut
[formGroup]
danname
.Anda harus mengganti
name
atribut denganformControlName
dan itu akan berfungsi dengan baik seperti berikut:sumber
Sepertinya Anda menggunakan ngModel di kolom formulir yang sama dengan formControlName. Dukungan untuk menggunakan properti input ngModel dan acara ngModelChange dengan arahan formulir reaktif tidak digunakan lagi di Angular v6 dan akan dihapus di Angular v7
sumber
Kesalahan ini muncul saat Anda memiliki beberapa kontrol formulir (seperti Input, Selects, dll) di tag grup formulir Anda tanpa properti formControlName.
Contoh-contoh tersebut menunjukkan kesalahan:
Ada dua cara, berdiri sendiri:
Atau memasukkannya ke dalam formgroup
Yang terakhir menyiratkan untuk mendefinisikannya dalam inisialisasi formGroup
sumber