Angular 角度-在form.setValue（）之后不更新反应形式

在我的项目中，我有一个带有自定义html元素的结构，类似于以下内容：

• 应用组件
  • 客户要素1
    • 客户要素2

基本上，

CustomElement2

是

CustomElement1

的子元素，它是

AppComponent

的子元素。这是我第一次使用超过1级深度的自定义元素，这给我带来了一些问题

下面的代码给出了这个想法：

custom-element-2.html：

<div [formGroup]="form">
    <mat-form-field>
        <input readonly matInput placeholder="ID" formControlName="id" >
    </mat-form-field>

    <mat-form-field>
        <input readonly matInput placeholder="Type" formControlName="type" >
    </mat-form-field>

    <mat-form-field>
        <input readonly matInput placeholder="Price" copyable formControlName="price" >
    </mat-form-field>
</div>

在CustomElement2中，有一个表单以空值开头，等待api响应。当响应返回时，我使用正确的表单控件调用

form.setValue（）

，但视图不会更新。我总是在每个表单实现中使用这种方法，我从来没有遇到过这个问题，所以我想这可能与自定义元素结构有关，因为这是我第一次使用它

如何在表单值更新后重新渲染视图

constructor() {
  this.form = fb.group({
    'id': [],
    'type': [],
    'price': [],
  })

  httpCall()
   .subscribe(json => {
     const product = json.data[0] //data is returning perfectly.

     this.form.setValue({
      'id': product.id,
      'type': product.type,
      'price': product.price
     })
}