Angular- Wie Validation dynamisch ausgeben

Question

Ich möchte auf die Klassen ng-berührte und ng-valid zugreifen, um eine Fehlermeldung zu drucken, konnte aber nicht herausfinden, wie. Hier ist mein Code-

<form #individual="ngForm"> 
    <div class="form-group"> 
     <label for="name">Name:</label> 
     <input type="text" class="form-control" id="name" ngModel name="name" pattern="[a-zA-Z ]*" required placeholder="Enter Your Name"> 
     <label *ngIf="!individual.control.name.valid">INVALID</label> 
    </div> 
    <button type="submit" class="btn" (click)="onSave(individual)" [disabled]="!individual.valid">SUBMIT</button> 
</form> 

Answer 1

eine lokale variabale am Eingang hinzufügen, die für die Modelländerungen beobachten, dann können Sie überprüfen, es ist Gültigkeit:

<input type="text" #myModel="ngModel" class="form-control" id="name" ngModel name="name" pattern="[a-zA-Z ]*" required placeholder="Enter Your Name"> 
<label *ngIf="myModel.invalid">INVALID</label> 

oder

<label *ngIf="!myModel.valid">INVALID</label> 

DEMO