Wie kann man überprüfen FormGroup Eingänge Angular

Question

Ich habe diesen Code in der Komponente:

this.loginForm = this._fb.group({ 
     phone: ['', [<any>Validators.required, <any>Validators.minLength(5)]], 
     password: ['', [<any>Validators.required, <any>Validators.minLength(7)]] 
    }); 

In Form Ich habe versucht, Nachricht zu zeigen, wenn der Eingang ist ungültig:

<small [hidden]="loginForm.controls.phone.invalid || (loginForm.controls.phone.pristine && !submitted)" class="text-danger"> 

Aber es funktioniert nicht Arbeit für mich

Answer 1

Es scheint, als ob Sie im Widerspruch zu hidden haben, sollte es sein

<small 
    [hidden]="loginForm.controls?.phone?.valid || (loginForm.controls?.phone?.pristine && !submitted)" 
    class="text-danger"> 

Aber lieber würde ich vorschlagen, Sie ngClass (mit hide Klasse)/ngIf Richtlinie hier zu verwenden, die hide Klasse basierend auf Ausdruck vorgesehen wird hinzufügen oder entfernen.

<small *ngIf="loginForm.controls.phone?.invalid || (loginForm.controls.phone?.pristine && !submitted)" class="text-danger">