Angular 11表单PatchValue/SetValue有时不起作用

Question

在我的表单中只有一个输入有时初始化正确，有时不正确。

<p-dropdown [placeholder]="'Grupo de movimentação' | translate" [options]="movementGroupOptions" name="movementGroup" optionLabel="label" formControlName="movementGroup"  datakey="id">
<ng-template let-movementGroup pTemplate="item">
<div style="display: flex; align-items: center;">
<img [src]="movementGroup.value.iconUrl" style="width: 20px; margin-right: 5px;" />
<span>{{movementGroup.value.name}}</span>
</div>
</ng-template>
<ng-template pTemplate="selectedItem">
<div style="display: flex; align-items: center;">
<img [src]="boatForm.get('movementGroup').value.iconUrl" style="width: 20px; margin-right: 5px;" />
<span>{{boatForm.get('movementGroup').value.name}}</span>
</div>
</ng-template>
</p-dropdown>

这是我的函数，应该设置表单值:

setBoatForm(): void {
Object.keys(this.boatForm.controls).forEach((key) => {
if (
this.boat[key] &&
this.boatForm.get(key) &&
this.boatForm.get(key).enabled
) {
if (key === 'boatCustomers') {
this.boat[key]
.filter((b) => b.type === CustomerType.Owner)
.forEach((b) => {
this.addCustomer(b);
});
this.boat[key]
.filter((b) => b.type !== CustomerType.Owner)
.forEach((b) => {
this.addAssociated(b);
});
}
if (key === 'boatServices') {
this.boat[key].forEach((s) => {
this.associateServiceBoat(s);
});
}
this.boatForm.get(key).patchValue(this.boat[key]);
}
});
}

但主要问题是，如果我运行一个console.log(this.boatForm.get('movementGroup')，在ngOnInit()函数的末尾，它会返回正确的对象，每次…但有时表单本身没有填充

Answer 1

应该在页面完全加载时调用html引用。ngAfterViewInit的生命周期钩子将在模板完全加载时触发，所以你应该在里面调用你的函数:

ngAfterViewInit(){
console.log(this.boatForm.get('movementGroup')
}