각도 4 템플릿 구동 형식 - 한 필드의 마크가 두 번째 터치되었습니다.

Question

두 필드가 있습니다 f.e.

<form #f="ngForm" novalidate (ngSubmit)="save(f.value, f.valid)"> 
<div> 
    <label>Name</label> 
    <input type="text" name="name" [(ngModel)]="user.name" #name="ngModel" required minlength="5"> 
    <label>Street</label> 
    <input type="text" name="street" [(ngModel)]="user.surname" #surname="ngModel" required> 
</div> 
<button type="submit">Submit</button></form> 

내가 터치 한 것과 같은 두 번째 필드를 표시하려면 가능합니까? 난 (ngModelChange)를 사용하려 = "surname.control.markAsTouched (true)를"이름을 감동으로 성 (姓)을 표시하지만, 그것을 당신이 처음 입력 값을 변경할 때, 당신이 (blur)을 사용할 수 있습니다 작동합니다

Answer 1

(ngModelChange) 작동 나던 첫 번째가 될 때 두 번째를 터치하십시오.

<input type="text" name="name" [(ngModel)]="user.name" #name="ngModel" 
    (ngModelChange)="surname.control.markAsTouched()" required minlength="5"> 
<input type="text" name="street" [(ngModel)]="user.surname" #surname="ngModel" required> 
{{surname.touched | json}} 
<button type="submit">Submit</button> 

Demo Plunker