Valido mi forma angular usando el siguiente código

 <div class="form-group"> <input type="text" minlength="12" maxlength="12" name="accountno" #accountNo="ngModel" required class="form-control" pattern="^[0-9]*$" [(ngModel)]="registerUser.accountNo" [class.is-invalid]="accountNo.invalid && accountNo.touched" placeholder="Account No."> <div [class.d-none]="accountNo.valid || accountNo.untouched"> <small *ngIf="accountNo.errors?.required" class="text-danger">Account No. is required</small> <small *ngIf="accountNo.hasError('pattern')" class="text-danger">Accout No. should be 12 numbers</small> <small *ngIf="accountNo.hasError('minlength')" class="text-danger">Accout No. must be at least 12 Numbers.</small> </div> </div>

Cuando escribo letras en el cuadro de texto, se disparan dos validaciones al mismo tiempo. por favor revise la imagen de abajo

como cargo mis validaciones una por una... gracias