【问题标题】:Angular 2 - Exporting Auth Services from AuthModule to AppModuleAngular 2 - 将身份验证服务从 AuthModule 导出到 AppModule
【发布时间】:2016-11-09 00:12:57
【问题描述】:

我决定将 LoginComponent、AuthService、LoggedInGuard 放在一个名为 AuthModule 的模块中:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AuthComponent } from './auth.component';
import { LoginComponent } from './components/login/login.component';

import { AuthService } from './services/auth/auth.service';
import { StorageService } from './services/storage/storage.service';
import { RequestService } from './services/request/request.service';

import { LoggedInGuard } from './guards/logged-in.guard';

@NgModule({
  imports: [
    CommonModule
  ],
  providers: [AuthService, LoggedInGuard],
  declarations: [AuthComponent, LoginComponent],
  exports: [AuthService, LoggedInGuard]
})
export class AuthModule { }

我只想在应用程序的其余部分中使用 AuthService 方法。和 LoggedInGuard 来保护非公共路由。

所以我尝试在 AppModule 中导入它们:

import { AuthModule } from './core/auth/auth.module';

@NgModule({
  declarations: [AppComponent, HomeComponent],
  imports: [
    BrowserModule,
    FormsModule,
    ReactiveFormsModule,
    HttpModule,
    AuthModule,
    RouterModule.forRoot(routes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

但在 app.routes.ts 中,LoggedInGuard 不支持这行代码:

import { LoggedInGuard } from './core/auth/auth.module'; 

它没有编译,它说:

...auth/auth.module 没有导出成员'LoggedInGuard'

如果我把它指向正确的地方:

import { LoggedInGuard } from './core/auth/guards/logged-in.guard';

它可以编译,但显示以下运行时错误:

模块“AuthModule”导出的意外值“AuthService”

你有什么建议吗?

提前致谢。

【问题讨论】:

    标签: angular angular2-services angular2-modules


    【解决方案1】:

    exports 不适用于服务。将服务添加到providers 就足够了。所以从exports中删除AuthServiceAuthGuard

    exports 的目的是让其他模块可以访问组件、管道、指令和其他模块。因此,您需要添加AuthComponentLoginComponent,以便能够在其他模块中使用它们。

    @NgModule({
      imports: [
        CommonModule
      ],
      providers: [AuthService, LoggedInGuard],
      declarations: [AuthComponent, LoginComponent],
      exports: [AuthComponent, LoginComponent]
    })
    export class AuthModule { }
    

    另请注意,将AuthModule 导入AppModule,只会使组件可用于AppModule 中声明的其他组件。任何其他想要使用这些组件的模块都应该导入AuthModule

    【讨论】:

    • @BoyanKostadinov 你的意思是文件export 还是@NgModule.exports。如果是后者,我想看看这方面的文档。如果是前者,我们实际上在这里谈论的是后者:-P @NgModule.providers 在应用程序范围的意义上已经使其对外部世界具有全球性
    • @PaspRuby 他们在providers数组中
    • @PaspRuby 您需要 1) 将类导入组件类文件 2) 将服务注入组件的构造函数。将其添加到 @NgModule.providers 可以使其他需要它的服务注入。
    • 需要从组件文件中导入。为什么要从模块文件中导入它?
    • 使组件/指令/管道能够在模板中使用...使服务可注入...所有这些概念都与Angular 应用程序有关,而不是文件相关的东西
    猜你喜欢
    • 1970-01-01
    • 2017-11-19
    • 2017-06-11
    • 2017-01-13
    • 2017-02-24
    • 1970-01-01
    • 2017-01-22
    • 1970-01-01
    • 2013-08-01
    相关资源
    最近更新 更多