1

编辑:建议的解决方案是正确的,我不得不提到SharedModule必须将其导入到使用 DropDownDirective 的子组件的父组件中才能工作。

我正在开发 Angular 4 应用程序,我想使用SharedModulewhich contains 来优化它的结构DirectivesModule。我有一个组件 X,它DirectivesModule通过导入其中一个指令来使用SharedModule它,如下所示:

应用程序/X.component.ts


import { SharedModule } from '../shared/shared.module';

在组件 X 的视图中,我使用如下指令:

<div class="col-xs-5 dropdown" appDropDown>

该应用程序的结构如下:

root
  -- X.component.ts
  -- shared
     -- shared.module.ts
     -- directives
        -- directives.module.ts
        -- dropdown.directive.ts

我在做什么,将 DirectivesModule 导入 SharedModule,如下所示:

import { CommonModule } from '@angular/common';
import { DirectivesModule } from './directives/directives.module';

@NgModule({
  imports: [
    CommonModule
  ],
  declarations: [
  ],
  exports: [
    DirectivesModule
  ]
 })
 export class SharedModule { }

DirectivesModule 像这样导入和导出 DropDownDirective:

   import { DropDownDirective } from './dropdown.directive';
   .....
    exports: [
     DropDownDirective,
   ]

然后,SharedModule按上述方式导入到 X.component 中。问题是该指令不起作用。它应该对元素应用一个“开放”类,但不这样做。

我不确定这是否是实现结构的正确方法,因此欢迎提出更改建议,任何帮助将不胜感激。

4

1 回答 1

1

添加DirectivesModule 到您的导入中

@NgModule({
  imports: [
    CommonModule,
    DirectivesModule
  ], 
......
于 2017-08-10T11:28:45.440 回答