我得到一个FormGroup
,其中包含要约,如下所示:
{
2018-01-01: [
{id: 1},
{id: 2}
],
2018-01-02: [
]
}
因此FormGroup
包含FormArray
个,它们本身携带了更多FormGroup
个。
到目前为止,一切正常。我将此保存到后端,然后从那里检索该数据。
但是,patchValue
/ setValue
无效的是:
this._offerService.getFromTo(this.placeId, this._fromDate, this._toDate)
.subscribe(
(data) => {
this.offers = data;
if (Object.keys(this.offers).length > 0) {
this.form.patchValue(data);
console.log(this.form.value);
}
}
);
我已经console.log
设置了返回值,对我来说看起来还不错。它包含正确的值。但是,由于某些原因,console.log(this.form.value);
不会向我显示data
的更新值,并且我看不出出现这种情况的原因。
知道为什么这可能行不通吗?
更新:
我也按照评论中的建议尝试了以下操作:
this.offers = data;
if (Object.keys(this.offers).length > 0) {
console.log(this.offers);
for (const k of Object.keys(this.offers)) {
console.log(this.offers[k]);
this.form.get(k).patchValue(this.offers[k]);
}
但是还是一样。表格没有更新。
这是表单的构建方式
主要/父组件创建form
,其中每个项目均为FormArray
:
resetCalendarForm() {
const groups = {};
this.dates.forEach(d => {
groups[d] = this._formBuilder.array([]);
});
if (Object.keys(groups).length > 0) {
this.form = this._formBuilder.group(groups);
}
this.formValueChange$ = this.form.valueChanges.subscribe((v) => {
this.dirtyChange.emit(this.form.dirty);
});
// This call is important after resetting in order to propagate the 'dirty' state
this.form.updateValueAndValidity();
}
子组件将此FormArray
传递给以下成员:
<app-calendar-day *ngFor="let date of dates$ | async"
[formArray]="form.get(date)">
</app-calendar-day>
其中,随着项目的选择,formArray
被表示元素的FormGroup
扩展:
onItemSelected(item) {
if (item == null) {
// Do not insert an element
return;
}
const offer = new OfferModel();
offer.item = item;
offer.offerDate = this.date;
this.formArray.push(this._formBuilder.group(offer));
this.formArray.markAsDirty();
this.resetMenuSearch();
}
这是来自服务器的数据 我希望在this.form
之后由patchValue
反映出来:
这是this.form.value
(不幸的是,在之后 patchValue
):