我在Angular 2应用程序中使用了表单ngControl.例:
<label for="login-field-inputLogin" class="sr-only">Login</label>
<input
[(ngModel)]="login"
id="login-field-inputLogin"
class="form-control"
placeholder="Login"
ngControl="loginCtrl"
#loginCtrl="ngForm"
type="text"
required />
<div [hidden]="loginCtrl.valid || loginCtrl.pristine" class="alert alert-danger">Login is required</div>
不幸的是,在IE 11上,当有一个占位符时,一旦该字段获得焦点,就会显示消息"需要登录".
我为AngularJS找到了解决这个问题的方法.请参阅AngularJS /如何防止IE触发自动输入验证？
如何使这个解决方案适应Angular 2？
我正在使用最新的Angular和最新的Angular Material.我有一个datepicker,我想添加一些验证.文档说该required属性应该开箱即用,但它似乎不像其他表单元素那样处理错误.
这是我的加价:
<mat-form-field class="full-width">
<input matInput [matDatepicker]="dob" placeholder="Date of birth" [(ngModel)]="myService.request.dob" #dob="ngModel" required app-validateAdult>
<mat-datepicker-toggle matSuffix [for]="dob"></mat-datepicker-toggle>
<mat-datepicker #dob></mat-datepicker>
<mat-error *ngIf="dob.errors && dob.errors.required">Your date of birth is required</mat-error>
</mat-form-field>
这适用于happy-path,因此当选择日期时,日期最终会出现在期望的属性中myService.
然而,验证并不像我期望的那样有效; 在这种情况下,如果我在没有输入日期的情况下单击该字段然后退出该字段,则输入会获得红色样式,但通常的[controlName].errors对象不会被填充.这意味着以通常的方式显示错误消息(与同一页面上不是日期选择器的其他输入一起使用的方式)不起作用:
<mat-error *ngIf="dob.errors && dob.errors.required">Your date of birth is required</mat-error>
在*ngIf因为日期选择器似乎从来没有更新是不正确的dob.errors,这样就不会显示错误消息,即使输入的样式为无效.
这是正确的吗？我错过了什么吗？
我还尝试添加一个自定义指令来验证使用datepicker选择的日期表明用户已超过18:
export class AdultValidator implements Validator {
constructor(
@Attribute('app-validateAdult') public validateAdult: string
) { }
validate(control: AbstractControl): { [key: string]: any } {
const …我想知道是否有可能以模糊的反应形式进行验证。目前，您可以进行设置，updateOn: "blur"但是输入字段的值不会在输入时更新。在我的情况下，我需要在每次击键时更新值，因为我会用它进行计算并将结果显示给用户。验证应仅在模糊时进行。
谢谢。
编辑：
我使用FormBuilder，一些内置的验证器和一些自定义的验证器。示例代码：
let formToMake = {
purpose: [null, Validators.required],
registrationDate: this.fb.group({
day: [null, Validators.required],
month: [null, Validators.required],
year: [null, Validators.required]
}),
isTruth: [null, Validators.compose([checkIfTrue, Validators.required])]
};
如果我要使用模糊事件，则需要手动进行所有验证，但我认为这不是一个好方法。