FormArray TypeError: value.forEach is not a function
FormArray TypeError: value.forEach is not a function
为什么我总是收到这个错误?我觉得我做的一切都对吗?
"EXCEPTION: Uncaught (in promise): TypeError: value.forEach 不是函数
TypeError: value.forEach 不是 FormArray.setValue 处的函数"
组件 Class:
jobDetails: FormGroup;
techFormArray: FormArray;
constructor(private formBuilder: FormBuilder){
this.techFormArray = new FormArray([
new FormControl(''),
new FormControl(''),
new FormControl('')
]);
this.jobDetails = this.formBuilder.group({
techs: this.formBuilder.array([])
});
this.jobDetails.setValue({
techs: this.techFormArray
});
}
HTML:
<form [formGroup]="jobDetails">
<div formArrayName="techs" >
<div style="display: flex; flex-direction: column">
<div *ngFor="let tech of techFormArray.controls; let i=index">
<md-checkbox [formControlName]="i">
{{i}}
</md-checkbox>
</div>
</div>
</div>
</form>
解决方案:
FunStuff 是对的,我不能使用 setValue....所以我删除了它。问题解决了哈哈。我改变了一些东西,我不确定我到底做了什么,这基本上是几个小时的暴力试验和错误,但后来它起作用了! :)
这是工作版本!
jobDetails: FormGroup;
constructor(private formBuilder: FormBuilder){
this.jobDetails = formBuilder.group({
techs: formBuilder.array([
formBuilder.control(''),
formBuilder.control('')
])
});
}
新 HTML:
<form [formGroup]="jobDetails">
<div formArrayName="techs" >
<div style="display: flex; flex-direction: column">
<div *ngFor="let tech of jobDetails.controls.techs.controls; let i=index">
<md-checkbox [formControlName]="i">
{{i}}
</md-checkbox>
</div>
</div>
</div>
</form>
setValue 方法采用简单值:
this.techFormArray = new FormArray([
new FormControl(''),
new FormControl(''),
new FormControl('')
]);
this.jobDetails = this.formBuilder.group({
techs: this.techFormArray
});
this.jobDetails.setValue({
techs: ['a', 'b', 'c']
});
因为您是在构造函数中执行此操作。否则你需要考虑清空 FormArray。
this.techFormArray.forEach((item, idx) => this.jobDetails.get('techs').setControl(idx, item));
为什么我总是收到这个错误?我觉得我做的一切都对吗?
"EXCEPTION: Uncaught (in promise): TypeError: value.forEach 不是函数 TypeError: value.forEach 不是 FormArray.setValue 处的函数"
组件 Class:
jobDetails: FormGroup;
techFormArray: FormArray;
constructor(private formBuilder: FormBuilder){
this.techFormArray = new FormArray([
new FormControl(''),
new FormControl(''),
new FormControl('')
]);
this.jobDetails = this.formBuilder.group({
techs: this.formBuilder.array([])
});
this.jobDetails.setValue({
techs: this.techFormArray
});
}
HTML:
<form [formGroup]="jobDetails">
<div formArrayName="techs" >
<div style="display: flex; flex-direction: column">
<div *ngFor="let tech of techFormArray.controls; let i=index">
<md-checkbox [formControlName]="i">
{{i}}
</md-checkbox>
</div>
</div>
</div>
</form>
解决方案:
FunStuff 是对的,我不能使用 setValue....所以我删除了它。问题解决了哈哈。我改变了一些东西,我不确定我到底做了什么,这基本上是几个小时的暴力试验和错误,但后来它起作用了! :)
这是工作版本!
jobDetails: FormGroup;
constructor(private formBuilder: FormBuilder){
this.jobDetails = formBuilder.group({
techs: formBuilder.array([
formBuilder.control(''),
formBuilder.control('')
])
});
}
新 HTML:
<form [formGroup]="jobDetails">
<div formArrayName="techs" >
<div style="display: flex; flex-direction: column">
<div *ngFor="let tech of jobDetails.controls.techs.controls; let i=index">
<md-checkbox [formControlName]="i">
{{i}}
</md-checkbox>
</div>
</div>
</div>
</form>
setValue 方法采用简单值:
this.techFormArray = new FormArray([
new FormControl(''),
new FormControl(''),
new FormControl('')
]);
this.jobDetails = this.formBuilder.group({
techs: this.techFormArray
});
this.jobDetails.setValue({
techs: ['a', 'b', 'c']
});
因为您是在构造函数中执行此操作。否则你需要考虑清空 FormArray。
this.techFormArray.forEach((item, idx) => this.jobDetails.get('techs').setControl(idx, item));