Angular：props 属性上的BehaviorSubject (@Input)

Question

我问以下代码是否是最好的方法。

背景

mesures 由父组件给出 每次测量更改时，子组件都必须应用一些检查。

组件

export class OngletMontantsPrevisionnelsComponent implements OnInit {
  @Input() mesures: Mesure[] = [];
  mesures$ = new BehaviorSubject<Mesure[]>([]);

  ngOnInit(): void {
    /** Initialisation des mesures manipulées par ce composant */
    this.mesures$.asObservable().subscribe(() => {
      this.checkMontantsPrevisionnels();
    });
    this.mesures$.next(this.mesures);
  }

  private checkMontantsPrevisionnels(): void {
    this.erreursMontantsPrevisionnels = [];

    // Vérifie que 250€ <= cumul HT prévisionnel <= 3000
    let sumMontantHTPrevisionnel = 0;
    this.mesures$.getValue().forEach((mesure) => {
      ...
    });
    ...
  }

  ajouterMesure() { ... }

  supprimerMesure() { ... }

您认为这是最好的方法吗？

感谢您的帮助

Answer 1

当您想要更新度量输入时，请确保在父级上创建一个新的浅副本

// do on parent when you want a refresh to happen
this.measures =[...this.measures];

当您更改数组 Angular 的引用时，会认为输入已更改并触发钩子 ngOnChanges

ngOnChanges() {
    this.checkMontantsPrevisionnels();
}

您不需要此场景的行为主题，只需使用普通数组即可，但您始终可以在钩子上调用

.next()

来触发相同的操作！