Angular 反應式表單 - FormArray ChangeDection onPush 不起作用

Question

我們在所有組件中使用 ChangeDetectionStrategy Onpush，因此我們遵循轉儲/智能組件方法，因此我們將所有邏輯部分保留在服務/外觀端。

現在我們需要使用 Reactive Forms、FormGroup、FormArray 生成動態控件，

所以我們在服務端准備 FormGroup 和 FormArray，並將它們作為輸入參數傳遞給轉儲組件，在這種情況下，我不能將它們作為可觀察的行為主體傳遞，我直接作為輸入參數傳遞。

如果 FormArray 中有任何更改，由於 OnPush changeDectionStrategy，它不會反映在轉儲組件中。

我在這個stackblitz中嘲笑了實現

在這個示例中，我在服務文件中准備了 FormArray、FormGroup，並通過智能組件傳遞給轉儲組件。

我在 Behavioursubject 和 Abstract control 上找不到合適的樣本，

如果可以將 FormArray、FormGroup 作為 Observable 傳遞，請幫助我了解。

Answer 1

在 stackblitz 示例中，即使在 Layer-Container 組件中，FormGroup 和 FormArrays 也是未定義的，因為變量是在加載初始數據之前從服務中獲取的。 如果你這樣做，然后獲取服務變量並將其傳遞給子組件，那么將獲得值。

import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
import { LayerService } from '../layer.service';

@Component({
  selector: 'app-layer-container',
  templateUrl: './layer-container.component.html',
  styleUrls: ['./layer-container.component.css'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class LayerContainerComponent implements OnInit {
layerFormGroup ;
layerFormArray ;

  constructor(private service : LayerService) { 
    this.service.loadInitialData();
    this.layerFormGroup = this.service.layerFormGroup;
    this.layerFormArray = this.service.layerFormArray; 
  }

  ngOnInit() {
    this.service.loadInitialData();
  }

}

而且由於 FormArray 和 FormGroup 都不是原始數據類型，@Input() 無法識別更改，我們可能無法檢測到更改。 傳遞這些變量的新引用可能就可以解決問題。