Jak odrzucić formularz w angular2

Question

Przeszedłem wiele postów, ale nie znalazłem tego, czego szukałem.

Zasadniczo,

Wyświetlam sprawdzanie poprawności użytkowników w formularzach. Mój szablon wygląda tak:

<div class="form-group" 
     [class.error]="!loginForm.find('email').valid && loginForm.find('email').touched"> 
     <div class="input-wrapper"> 
      <input type ="email" 
       class="form-control" 
       id="email-input" 
       placeholder="Email" 
       formControlName="email"> 
     </div> 
     <div *ngIf="loginForm.controls['email'].dirty && !loginForm.controls['email'].valid" 
      class="alert-msg">Email is invalid</div> 
</div> 

I, patrząc na innych stanowiskach, które debounces TS moja postać jest następująca:

this.loginForm.valueChanges.debounceTime(500).subscribe(form => { 
    console.log(form, this.loginForm); 
}); 

Teraz, dzienniki konsoli faktycznie debouncing. Ale komunikat sprawdzania poprawności nie ulega odrzuceniu. Pokazuje od razu wiadomość.

Czy istnieje sposób na rozwiązanie tego problemu?

Dzięki za zatrzymanie się,

Answer 1

wierzę debounceTime będzie dotyczyła jedynie kod masz w odpowiedzi form => { ... }. Więc co można zrobić, to ustawić sprawdzanie tam:

private loginFormIsValid:boolean; 
private emailIsNotValid:boolean; 

ngOnInit() { 
    this.loginForm.valueChanges.debounceTime(500).subscribe(form => { 
     this.loginFormIsValid = !loginForm.find('email').valid 
      && loginForm.find('email').touched; 
     this.emailIsNotValid = loginForm.controls['email'].dirty 
      && !loginForm.controls['email'].valid; 
     console.log(form, this.loginForm); 
    }); 
} 

... A potem będzie go używać w ty szablon następująco:

<div class="form-group" [class.error]="!loginFormIsValid"> 
    <div class="input-wrapper"> 
     <input type ="email" 
      class="form-control" 
      id="email-input" 
      placeholder="Email" 
      formControlName="email"> 
    </div> 
    <div *ngIf="emailIsNotValid" 
     class="alert-msg">Email is invalid</div> 
</div> 

Można spojrzeć na post on debouncing, to dobry przykład.