我创建了这个表单:
this.cardForm = this.fb.group({
number: ['', Validators.compose([Validators.required, this.validateCardNumber])],
holderName: ['', Validators.required],
expiry: this.fb.group({
expirationMonth: ['', Validators.required],
expirationYear: ['', Validators.required],
}),
如您所见,我创建了一个名为 expiry
的嵌套表单组 . 进入我的模板:
<form [formGroup]="cardForm" novalidate="novalidate" (ngSubmit)="onSave()">
<div class="form-group">
<label for="cardnumber">Card number</label>
<input
type="text"
formControlName="number"
placeholder="Card number"
name="cardnumber"
class="input-transparent form-control">
</div>
...
<div class="form-group" formGroupName="expiry">
<label for="expirationmonth">Expiration month</label>
<select2 id="default-select"
name="expirationmonth"
[data]="months$ | async"
[width]="250"
[options]="select2Options">
</select2>
<label for="expirationyear">Expiration year</label>
<select2 id="default-select2"
name="expirationyear"
[data]="years$ | async"
[width]="250"
[options]="select2Options">
</select2>
</div>
我收到这个错误:
ERROR Error: formGroup expects a FormGroup instance. Please pass one in.
Example:
<div [formGroup]="myGroup">
<input formControlName="firstName">
</div>
In your class:
this.myGroup = new FormGroup({
firstName: new FormControl()
});
有任何想法吗?
1 回答
在组件端设置
this.cardForm
之前,您的视图已加载 .试着把
*ngIf
:或者尝试使用
*ngIf
封装在div中: