각도 DatePicker에 대한 검도 UI에 대한 유효성 검사가 작동하지 않습니다.

Question

각도 DatePicker에 대한 검도 UI에서 양식 유효성 검사를 사용하려고하는데 작동하지 않는 것 같습니다.

것은 나는 다른 모든 폼 요소에 다음과 같은 일을 해요 :이 완벽하게 잘 작동

<div class="form-group row" [ngClass]="{ 'has-danger' : email.invalid && (email.dirty || email.touched) }"> 
    <input id="email" type="text" class="form-control" [(ngModel)]="member.email" name="email" #email="ngModel" required /> 
</div> 

. 나는 다음과 같은 오류가 각도 DatePicker에서의 검도 UI와 동일 할 때

는하지만 :

There is no directive with "exportAs" set to "ngModel". 

것은 내가 찾을 수 없습니다 :

<div class="form-group row" [ngClass]="{ 'has-danger' : geburtsdatum.invalid && (geburtsdatum.dirty || geburtsdatum.touched) }"> 
    <kendo-datepicker 
     id="geburtsdatum" 
     [format]="'dd.MM.yyyy'" 
     [(value)]="mitglied.geburtsdatum" 
     #geburtsdatum="ngModel" 
     required> 
    </kendo-datepicker> 
</div> 

는 지금은 오류가 각도 모양 요소에 대한 검도 UI를 간단한 방식으로 검증하는 방법.

Answer 1

exportAs은 구성 요소/지시어를 내보낼 이름을 정의합니다. 이 경우 구성 요소 선언에없는 ngModel을 내보내려고합니다. 해결책은 간단합니다. [(value)] 바인딩 대신 [(ngModel)]을 사용하면됩니다. 따라서 각도는 NgModel 인스턴스를 선택하고 내보낼 수있을 것입니다 :

<kendo-datepicker 
    id="geburtsdatum" 
    [format]="'dd.MM.yyyy'" 
    [(ngModel)]="mitglied.geburtsdatum" 
    #geburtsdatum="ngModel" 
    required> 
</kendo-datepicker> 

확인 자세한 내용은 각도 양식 문서, 어떻게 제대로/숨기기 유효성 검사 오류를 표시합니다.

https://angular.io/guide/forms#show-and-hide-validation-error-messages

는 [TL, DR]는

DatePicker에서 성분은 완전히 호환 모난 형태 성분하게 ControlValueAccessor 인터페이스를 구현한다. 각도 Validation on the other hand works을 AbstractControl 인스턴스 (기본적으로 NgModel 또는 FormControl 지시문)로 지정합니다. 염두에두고

, 검증 작업을 얻기 위해, 당신도 [ngModel] 또는과 구성 요소를 장식해야합니다 [formControl | formControlName] :

<kendo-datepicker 
     name="birthDate" 
     [(ngModel)]="user.birthDate" 
     [min]="min" 
     [max]="max" 
></kendo-datepicker> 

다음

이 방법을 보여줍니다 작동하는 데모입니다 :

상기 리딩

https://plnkr.co/edit/seJ4jLg9WziemQtCVuxk?p=preview

, 각 형태의 문서를 참조 :

01,239,