Не стреляйте форма проверки в угловом 2 на размытость

Question

я был в состоянии интегрировать форму проверки в угловом 2.

Я использую form = formBuilder.group({...}) метод.

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

EDIT:

Проблема с использованием *ngIf или [hidden] является то, что они прекрасно работают с переменными для отслеживания формы представления. Но Проверка только срабатывает, когда я размываю вход. Другим способом проверки не срабатывает, когда пользователь не посетил вход.

Answer 1

Вам необходимо интегрировать пользовательское свойство formSubmitted в ваше выражение, чтобы отображать ошибки. Например:

<span *ngIf="formSubmitted && form.controls.someCtrl.errors?.someerror"> 
    Some message 
</span> 

По умолчанию его значение равно false и будет установлен в true, когда форма была отправлена.

@Component({ 
    (...) 
    template: ` 
    <form (ngSubmit)="onFormSubmitted()"> 
    </form> 
    ` 
}) 
export class SomeComponent { 
    formSubmitted: boolean = false; 

    onFormSubmitted() { 
    this.formSubmitted = true; 
    } 
} 

Answer 2

Показать ошибки только тогда, когда представленные плоско установлен:

<form (ngSubmit)="submit()" ...> 
<input ngControl="name" #name="ngForm" type="text"> 
<span [hidden]="name.valid && isSubmitted"><b>Required</b></span> 
</form> 

class MyComponent { 
    isSubmitted:boolean = false; 

    submit() { 
    this.isSubmitted = true; 
    } 
}