angular 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>

我想将 secondone 中的其中一个字段标记为已触摸，这可能吗？我尝试在名称上使用 (ngModelChange)="surname.control.markAsTouched(true)" 将姓氏标记为已触摸，但它不起作用

Answer 1

(ngModelChange) 将在您更改第一个输入值时起作用，您可以使用 (blur) 标记在第一个输入时触摸的第二个。

<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

angular 4 模板驱动表单 - 将一个字段标记为已触及

angular 4 template driven form - mark from one field secondone as touched

ngmodel

angular

angular4-forms

angular-ngmodelchange