javascript - Angular 2 自定义数据验证 - 改变风格

Question

我正在尝试使用验证器根据数字输入中的输入值更改颜色。我有几个不同的范围应该对应不同的颜色。我为每个范围使用不同的验证器。这是其中之一的示例:

// Validation for scanid
  volumeValidationRange1(controls) {
    var vol = controls.value;
    if (vol > 10.0 && vol <= 20.0) {
      // controls.style.backgroundColor = 'orange';
      document.getElementById('123').style.backgroundColor = 'orange';
      return { 'volumeValidationRange1': true } // Return error in validation
    } else {
      return null; // return valid
    }
  }

当我使用 document.getElementById('123').style.backgroundColor = 'orange'; 时有效，但是 controls.style.backgroundColor = 'orange'; 不起作用。控件的类型为 FormControl。有没有办法使用 FormControl 更改样式？

Answer 1

您不能通过 FormControls 的方法和属性访问任何样式。
在这种情况下，只有 DOM 元素具有此属性。
您可以检查构造函数中实例化的属性和方法:https://angular.io/api/forms/FormControl