Question

我已经创建了一个类似于角度文档中的hightlight指令但是，我无法在appmodule中导入的其他模块中使用它。以下是我的appmodule.ts文件：

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

import { AppComponent } from './app.component';
import { PrimaryNavigationComponent } from './components/primary-navigation/primary-navigation.component';

import { DashboardModule } from 'app/features/dashboard/dashboard.module';
import { ServicesModule } from 'app/features/services/services.module';
import { NotificationsModule } from 'app/features/notifications/notifications.module';
import { AboutModule } from 'app/features/about/about.module';
import { RedirectModule } from 'app/features/redirect/redirect.module';
import { HighlightDirective } from 'app/directives/highlight/highlight.directive';

@NgModule({
  declarations: [
    AppComponent,
    PrimaryNavigationComponent,
    HighlightDirective
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    DashboardModule,
    ServicesModule,
    NotificationsModule,
    AboutModule,
    RedirectModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

请帮我解决这个问题。

Answer 1

Angular模块系统乍一看可能会让人感到困惑，但是一旦习惯了它就非常简单。

有一些简单的规则要遵循：

每个组件/指令/管道（即您在模板中使用的项目也称为声明）必须在一个且只有一个模块中声明（对您来说不是问题） < / LI>
如果在模块中声明一个名为X的组件/指令/管道，那么同一模块中的任何其他组件/指令/管道都可以在自己的模板中使用X（同样不是问题）
如果要在其他模块N中使用模块M中声明的名为X的组件/指令/管道，则：
- X必须从模块M
- 模块N必须导入模块M

那就是你错了 - 你必须从声明它的模块中导出你的HighlightDirective，以便在其他模块中使用它。

但是，在您的情况下，您的AppModule已经依赖于您的功能模块（您将功能模块，例如DashboardModule，ServicesModule等导入AppModule）。 Angular不喜欢循环引用，因此您无法让AppModule导入功能模块，然后让该功能模块转向并尝试导入AppModule。

因此，您的问题的整体解决方案是将要在多个模块中使用的声明（组件/指令/管道）移动到新模块（例如SharedModule），从该SharedModule导出这些声明，然后使用您的AppModule和功能模块导入SharedModule。

Answer 2

您需要在模块

中导出指令

@NgModule({
  ......,
  exports:[HighlightDirective]
})
export class AppModule { }

Angular 4：如何在appmodule中导入的其他模块中注入bootstrapped模块（appmodule）中声明的指令？

2 个答案: