HTML:
<form #accountForm="ngForm">
<dl class="form-group">
<dt><label>First Name</label></dt>
<dd><input [(ngModel)]="firstName"
name="fname"
class="form-control"
type="text"
required
minlength="3"
maxlength="24"></dd>
</dl>
<dl class="form-group">
<dt><label>Last Name</label></dt>
<dd><input [(ngModel)]="lastName"
name="lname"
class="form-control"
type="text"
required
minlength="3"
maxlength="24"></dd>
</dl>
<dl class="form-group">
<dt><label>Email</label></dt>
<dd><input [(ngModel)]="email"
name="email"
class="form-control"
type="email"
disabled></dd>
</dl>
<dl class="form-group">
<dt><label>Mobile Phone</label></dt>
<dd><input [(ngModel)]="phone"
name="phone"
class="form-control"
type="text"
required
pattern="^(\+\d{1,2}\s)?\(?\d{3}\)?[\s.-]\d{3}[\s.-]\d{4}$"></dd>
</dl>
<dl class="form-group">
<dt><label>Bio</label></dt>
<dd>
<textarea [(ngModel)]="bio"
name="bio"
class="form-control"
required
minlength="5"
maxlength="50"
maxLength="50"></textarea>
</dd>
</dl>
<div class="form-actions">
<button type="button"
class="btn btn-primary"
[disabled]="!accountForm.form.valid"
(click)="updateUserEntry(firstName, lastName, phone, bio)">Save changes</button>
</div>
</form>
如何强制Angular 2验证预先输入的值?
例如,这些输入是为了更改您的姓名,电话号码等,因此它们包含的值已经从数据库中引入并通过[(ngModel)]共享,但内置的ng2验证似乎只是验证新输入的值。 (也就是说,在用户重新输入已存在的值之前,“保存更改”按钮不会启用)