Angular 5:找不到模块:错误:无法解析'@ angular / forms / src / validators'

时间:2018-01-17 06:01:49

标签: angular typescript angular-directive customvalidator angular-validation

我正在尝试使用指令创建自定义验证程序,但收到以下错误。

ERROR in ./src/app/CustomValidators/white-space-validator.directive.ts
Module not found: Error: Can't resolve '@angular/forms/src/validators' in 'D:\Angular\Admin\src\app\CustomValidators'
resolve '@angular/forms/src/validators' in 'D:\Angular\Admin\src\app\CustomValidators'
  Parsed request is a module
  using description file: D:\Angular\Admin\package.json (relative path: ./src/app/CustomValidators)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: D:\Angular\Admin\package.json (relative path: ./src/app/CustomValidators)
    resolve as module.....

指令文件中的代码:

import { Directive } from '@angular/core';
import { ValidatorFn, Validator } from '@angular/forms/src/directives/validators';
import { AbstractControl, FormControl } from '@angular/forms/src/model';
import { NG_VALIDATORS } from '@angular/forms/src/validators';

@Directive({
  selector: '[whiteSpace][ngModel]',
  providers: [
    { provide: NG_VALIDATORS, useExisting: WhiteSpaceValidatorDirective, multi: true }
  ]
})

export class WhiteSpaceValidatorDirective  {
  validator : ValidatorFn;

  constructor() { 
    this.validator = checkWhiteSpaces();
  }

  validate(c: FormControl){
    return this.validator(c);
  }
}

function checkWhiteSpaces(): ValidatorFn {
  return (c: AbstractControl) => {
    let isValid = c.value.trim().length > 0 ? true : false;
    if (isValid) {
      return null;
    }
    else {
      return {
        whiteSpace: { valid: false }
      }
    }
  }
}

我正在使用的软件包版本:

  
      
  • Angular CLI:1.5.5节点:8.2.1操作系统:win32 x64 Angular:5.1.2 ...动画,通用,编译器,编译器 - cli,核心,表单... http,
      语言服务,平台浏览器......平台浏览器动态,
      路由器      @ angular / cli:1.5.5 @ angular-devkit / build-optimizer:0.0.36 @ angular-devkit / core:0.0.22 @ angular-devkit / schematics:0.0.42
      @ ngtools / json-schema:1.1.0 @ ngtools / webpack:1.8.5
      @ schematics / angular:0.1.11 @ schematics / schematics:0.0.11
      打字稿:2.4.2 webpack:3.8.1
  •   

任何帮助?

1 个答案:

答案 0 :(得分:4)

仅从@angular/forms

导入
import { 
      ValidatorFn,
      Validator, 
      AbstractControl, 
      FormControl, 
      NG_VALIDATORS 
} from '@angular/forms';