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

Question

我在角形表组中有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)
  );