Angular 2 - 将Auth服务从AuthModule导出到AppModule

Pas*_*uby 9 angular2-services angular2-modules angular

我决定将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 { }
Run Code Online (Sandbox Code Playgroud)

我想在Application的其余部分中仅使用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 { }
Run Code Online (Sandbox Code Playgroud)

但在app.routes.ts中,LoggedInGuard不适用于以下代码行:

import { LoggedInGuard } from './core/auth/auth.module'; 
Run Code Online (Sandbox Code Playgroud)

它没有编译,它说:

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

如果我把它指向正确的位置:

import { LoggedInGuard } from './core/auth/guards/logged-in.guard';
Run Code Online (Sandbox Code Playgroud)

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

模块'AuthModule'导出的意外值'AuthService'

你有什么建议我吗?

提前致谢.

Pau*_*tha 21

exports不是为了服务.添加服务providers就足够了.所以删除AuthServiceAuthGuardexports.

什么exports 使组件,管道,指令和其他模块可访问的其他模块.因此,您需要添加AuthComponent,并且LoginComponent您希望能够在其他模块中使用它们.

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

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

  • 要使组件/指令/管道能够在模板中使用...以使服务可注入......所有这些概念都与Angular _application_相关,而不是_file相关的东西_ (2认同)