小编bks*_*inn的帖子

角度4 * ng如果未显示用于自定义验证的错误消息

我正在尝试在Angular 4中测试自定义验证,并且正在使用angular 这里提供的'appForbiddenName'验证。

这是我的代码设置:

<div class='col-xs-12 col-sm-5'>
  <div class="form-group">
      <label class="control-label" for="firstName">First Name</label>
      <input class="form-control input-md" 
              #firstName="ngModel" 
              required name="firstName" 
              minlength="4" appForbiddenName="bob" 
              type="text" 
              placeholder="First Name"
              [(ngModel)]="personal.firstName">
      <div style="font-size: 12px; color: red;" 
            *ngIf="firstName.invalid && (firstName.dirty || firstName.touched)"[hidden]="firstName.valid">
        <div *ngIf="firstName.errors.required">*Required</div>
        <div *ngIf="firstName.errors.minlength">Min length is 4</div>
        <div *ngIf="firstName.errors.appForbiddenName">Name cannot be bob</div>
      </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

在app.module.ts中,我从创建的共享文件夹(位于/ *共享服务* /下)导入了ForbiddenValidatorDirective:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

/* App Root */
import { AppComponent …
Run Code Online (Sandbox Code Playgroud)

html5 angular typescript2.3 angular-forms

5
推荐指数
1
解决办法
2460
查看次数

标签 统计

angular ×1

angular-forms ×1

html5 ×1

typescript2.3 ×1