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() 无法识别更改，我们可能无法检测到更改。 传递这些变量的新引用可能就可以解决问题。