文件验证指令声明在两个不同的模块中不起作用答案

【问题标题】：Filevalidation directive declaration not working in two different module文件验证指令声明在两个不同的模块中不起作用
【发布时间】：2017-12-25 12:52:14
【问题描述】：

未捕获的错误：类型 FileValueAccessor 是声明的一部分 2个模块：moduleX和moduleY请考虑将 FileValueAccessor 移动到导入的更高模块模块X 和模块Y。你也可以新建一个导出并包含 FileValueAccessor 的 NgModule 然后导入 moduleX 和 moduleY 中的 NgModule。

如果我在 app.module 中声明了 FileValueAccessor 和两个模块，那么它正在阅读另一个模板错误。

ERROR DOMException: 无法设置 'value' 属性 'HTMLInputElement'：这个输入元素接受一个文件名，它可以只能以编程方式设置为空字符串。

如果我声明在不同模块中使用文件验证的组件，则它适用于 app.module。

为什么我需要在 app.module 中声明这些组件？我已经有两个使用延迟加载的不同模块。

尝试从两个模块导入导出组件，但它也想要工作:(

【问题讨论】：

标签： angular angular4-forms

【解决方案1】：

为了解决这个问题“Type FileValueAccessor 是 2个模块的声明”

我们需要创建shared/Shared.module.ts

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

import { FileValueAccessor } from './validation/file-control-value-accessor';
import { FileValidator } from './validation/file-input.validator';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    ReactiveFormsModule,
    HttpModule
  ],
  exports: [
    BrowserModule,
    FormsModule,
    ReactiveFormsModule,
    HttpModule,
    FileValueAccessor,
    FileValidator
  ],
  declarations: [
    FileValueAccessor,
    FileValidator
  ],
  providers: [
  ]
})
export class SharedModule { }

并将这个 shared.module.ts 文件导入到 moduleX 和 moduleY。这将解决问题。

【讨论】：