Angular Nested Formarray 推送不更新模板 - 编辑屏幕

如何解决Angular Nested Formarray 推送不更新模板 - 编辑屏幕

我有一个嵌套的 FormArray。当我尝试推送一个孩子 FormArray 时，它会更新控件。我可以看到日志中有 2 个控件。但是模板没有更新。

试图推动这个FormGroup

    initItemRows = () => {
        return this.fb.group({
          attribute: ['path'],exclude: ['match'],value: [''],name: [''],locate: ['locate'],context: ['client_request'],geotype: [],});
      }

    const ttlRowsControl = this.cachingFormGroup.get('ttlRows') as FormArray;

    this.addNewRow('ttlRows',this.initTtlRows()); //parent formarray. this works fyne

    this.addNewRow(ttlRowsControl.controls[i].get('itemRows'),this.initItemRows()); // this shows the log as below

    addNewRow(key,pushControl): void {
        const control = this.getControl(key);
        control.push(pushControl);
    }

日志数据

value: Array(2)
0: {attribute: "path",exclude: "match",value: "/test",name: "",locate: "locate",…}
1: {attribute: "host",value: "/host",…}
length: 2