javascript - Angular FormGroup - 自动将另一个字段的值除以 100

Question

我在一个 Angular 形式组中有 3 个字段，其中一个字段基本上是供用户自动从另一个字段中划分值的工具。因此，用户键入一个数字，另一个字段会自动显示该值除以 100。

看起来像这样:

formGroup = new FormGroup({
        Buildyear:           new FormControl(this.buildyear, [Validators.minLength(4), Validators.maxLength(4)]),
        Areasize:            new FormControl(this.areasize, [Validators.required] ),
        Areasize_divided:    new FormControl(''),
     });

“Areasize_divided”自动划分“Areasize”内的值，默认情况下该字段中已经有一个值，但如果用户在“Areasize”中键入一个新值，该值也应该在“Areasize_divided”中自动计算。反过来，如果用户在“Areasize_divided”中输入一个值，它会自动将“Areasize”乘以 100。

实现这样的目标的最佳方式是什么？

Answer 1

您应该监听表单控件的变化并相应地更新您的其他控件。

formGroup.get('Areasize')
  .valueChanges
  .subscribe(value => formGroup
    .get('Areasize_divided')
    .setValue(isNaN(value) ? 0 : value / 100)
  );