각도 4는 모든 입력 유효성 오류를 표시합니다.

Question

첫 번째 각도 4 앱을 만들기 시작합니다. 양식 유효성 검사를 테스트하고 있습니다. 템플릿 드라이버 형식을 만들었고 유효성 검사기를 추가했습니다.

이제 필드에 대한 유효성 검사 오류를 표시하려고합니다. 이것은 내 실제 코드입니다 :

<input 
    id="name" 
    name="name" 
    class="form-control" 
    required 
    minlength="4" 
    [(ngModel)]="name" #name="ngModel" > 

<div 
    *ngIf="name.invalid && (name.dirty || name.touched)" 
    class="alert alert-danger"> 

    <div *ngIf="name.errors.required"> 
    Name is required. 
    </div> 
    <div *ngIf="name.errors.minlength"> 
    Name must be at least 4 characters long. 
    </div> 

</div> 

나는 내 양식의 모든 입력에 대해 이것을 작성하는 데 애착이 있습니다! 가능처럼 뭔가를 작성하는 것입니다 (물론,이 코드를 시도했지만 작동하지 않았다) :

<div 
    *ngIf="name.invalid && (name.dirty || name.touched)" 
    class="alert alert-danger"> 

    <p *ngFor="let error on name.errors">{{error}}</p> 

</div> 

고맙습니다 당신의 도움 :)

Answer 1

희망

이 당신을 도울 것입니다 위해.

Simple Solution but not a generic one.

그것은 필요

유효성 검사 오류를 표시하기 위해 변경 될 수 있습니다.