Проверьте одно поле ввода angular реактивной формы в зависимости от значения другого - PullRequest
Новая
       7

Проверьте одно поле ввода angular реактивной формы в зависимости от значения другого

0 голосов
/ 03 апреля 2020

У меня есть angular реактивная форма с полями ввода HTML

<form [formGroup]="ExampleForm">
<input formControlName="Key" id="Key" type="text" 
     [attr.aria-required]="ExampleForm.get('Key').errors ? ExampleForm.get('Key').errors.required ? 'true' : null : null"
     [attr.data-invalid]="(isControlInvalid('Key')) ? 'true' : null"/>
     <div>"error1"</div>


<input formControlName="Value" id="Value" type="text" 
     [attr.aria-required]="ExampleForm.get('Value').errors ? ExampleForm.get('Value').errors.required ? 'true' : null : null"
     [attr.data-invalid]="(isControlInvalid('Value') || validateValue()) ? 'true' : null"/>
     <div *ngIf = "validateValue()">"error1"</div>
     <div *ngIf = "ExampleForm.get('Value').errors ? ExampleForm.get('Value').errors.required ? 'true' : null : null">"error2"</div>

У меня есть файл ts как 

this.ExampleForm = this.fb.group({
            Key: ["", Validators.required],
            Value: ["", Validators.required]
        });

validateValue() {
        let key = this.ExampleForm.get("Key").value;
        let value = this.ExampleForm.get("Value").value;
        if ((value && value.length > 0) && (key === "Apple")) {
            this.ExampleForm.get("Value").setValidators([Validators.required, Validators.pattern("^[0-9A-Za-z .-]+$")]);
            return true;
        }
        return false;
    }

Мне нужно проверить поле «значение» на основе текст присутствует в «ключе» и показывает сообщения об ошибках соответственно. с приведенным выше кодом оба сообщения об ошибках всплывают, если текст также соответствует проверке. Как я могу добиться этого?

...