10

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」

何をお勧めしますか?

前もって感謝します。

4

1 に答える 1

23

exportsサービス用ではありません。サービスを追加するprovidersだけで十分です。したがって、からAuthServiceとを削除します。AuthGuardexports

コンポーネント、パイプ、ディレクティブ、およびその他のモジュールを他のモジュールからアクセスできるようにするためのものですexports AuthComponentしたがって、を追加する必要がありLoginComponentます。これは、他のモジュールでそれらを使用できるようにするためです。

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

AuthModuleまた、 を にインポートすると、AppModuleで宣言された他のコンポーネントがコンポーネントを使用できるようになるだけであることに注意してくださいAppModule。これらのコンポーネントを使用する他のモジュールは、AuthModule.

于 2016-11-09T00:35:18.463 に答える