相关疑难解决方法(0)

我有一个自定义表单控件组件(它是一个美化的输入).它是一个自定义组件的原因是为了便于UI更改 - 即如果我们改变我们对输入控件进行样式设置的方式,则可以很容易地在整个应用程序中传播更改.

目前我们在Angular https://material.angular.io中使用Material Design

哪些样式在无效时控制得非常好.

我们已经实现了ControlValueAccessor,以便允许我们将formControlName传递给我们的自定义组件,该组件工作正常; 当自定义控件有效/无效且应用程序按预期运行时,表单有效/无效.

但是,问题是我们需要根据自定义组件是否无效来设置自定义组件的样式,我们似乎无法做到这一点 - 实际需要设置样式的输入永远不会被验证,它只需将数据传入父组件或从父组件传递数据.

COMPONENT.ts

import { Component, forwardRef, Input, OnInit } from '@angular/core';
import {
    AbstractControl,
    ControlValueAccessor,
    NG_VALIDATORS,
    NG_VALUE_ACCESSOR,
    ValidationErrors,
    Validator,
} from '@angular/forms';

@Component({
  selector: 'app-input',
  templateUrl: './input.component.html',
  styleUrls: ['./input.component.css'],
  providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => InputComponent),
      multi: true
    }
  ]
})
export class InputComponent implements OnInit, ControlValueAccessor {
  writeValue(obj: any): void {
    this._value = obj;
  }
  registerOnChange(fn: any): void {
    this.onChanged = fn;
  }
  registerOnTouched(fn: any): …