Проверка с использованием оператора if с использованием привязки ввода в Angular - PullRequest
Новая
       37

Проверка с использованием оператора if с использованием привязки ввода в Angular

1 голос
/ 10 марта 2020

Я создаю повторно используемый компонент для поля ввода. Я создал логический тег с именем «IsValid» внутри моего файла машинописи, чтобы показать сообщение проверки.

Мой файл машинописи 

export class InputControlsComponent implements OnInit {

  @Input() IsValid;
  @Input() className;
  @Input() controlName;
  @Input() inputType;

  constructor() { }

  ngOnInit() {
  }

}

Html Файл 

<div>
  <input type="{{inputType}}" class="{{className}}" >
  <span class="error-message" *ngIf="!IsValid">This Field is required</span>
</div>

Как он используется 

<div>
          <label>Name</label>
          <app-input-controls  inputType="text"  controlName="Address" className="form-control" IsValid = "false">
          </app-input-controls>
</div>

Я могу изменить значение логического тега файла машинописного текста, но сообщение об ошибке не меняется при изменении логического тега.

Ответы [ 2 ]

0 голосов
/ 10 марта 2020

изменить! IsValid на IsValid. это будет работать 

  <div>
      <input type="{{inputType}}" class="{{className}}" >
      <span class="error-message" *ngIf="IsValid">This Field is required</span>
    </div>
0 голосов
/ 10 марта 2020

Вы можете использовать ngModel, например [(IsValid)],

Если вы используете ngModel, ваша модель будет привязана двумя способами.

Например, установите html

<app-input-validation  [inputType]="'text'"  [controlName]="Address" [className]="form-control" [(IsValid)]="isValidDate">
</app-input-validation>

Вы можете установить свойство isValid для родительского компонента в любое время.

Только запись this.isValidText=true;

Пожалуйста, изучите пример

...