Question

我有AppModule导入CoreModule。 CoreModule的purpouse将处理数据访问服务，因此CoreModule提供UserService，PlansService等等：

@NgModule({
  providers: [
    UsersService,
    PlansService,
    {
      provide: LocationStrategy,
      useClass: ('production' === ENV ? HashLocationStrategy : PathLocationStrategy)
    }
  ]
})
export class CoreModule { }

所以在AppModule我导入它：

@NgModule({
  bootstrap: [ App ],
  declarations: [
    App,
    ErrorComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    CoreModule,   <<<<<<<<<<<<<<<<<<
    RouterModule.forRoot(ROUTES, { useHash: true })
  ]
})
export class AppModule {

然而，在LoginComponent angular告诉我它无法获得UserService的提供者：

@Component({
    ...
})
export class LoginComponent implements OnInit {

    constructor(private commty: UsersService)

LoginModule根据其路由器配置懒惰加载，它是：

export const routes = [
  { path: '', component: LoginComponent, pathMatch: 'full' }
];

@NgModule({
  declarations: [
    LoginComponent
  ],
  imports: [
    CommonModule,
    ReactiveFormsModule,
    AlertModule,
    RouterModule.forChild(routes),
  ],
})
export default class LoginModule {
  static routes = routes;
}

我做错了什么？我需要import CoreModule登录LoginModule吗？如果我这样做，那么CoreModule个实例呢？它加载了两次吗？

这是我从角度得到的错误：

未处理的承诺拒绝：没有UserService的提供商！

Answer 1

您不必将CoreModule导入LoginModule。您可以通过将UsersService设置为LoginComponent的提供程序来解决问题。

<强> LoginComponent：

@Component({
    providers: [ UsersService  ]
    //...
})
export class LoginComponent implements OnInit {
    constructor(private commty: UsersService)
}

Answer 2

因为你正在使用延迟加载，所以你需要在惰性模块和非延迟模块中导入CoreModule。

现在我们已经证明延迟加载的模块可以创建自己的模块在依赖注入树上分支，我们需要学习如何处理使用通过共享模块导入的服务渴望和懒惰的模块。

https://angular-2-training-book.rangle.io/handout/modules/shared-modules-di.html

@NgModule({
  declarations: [
    LoginComponent
  ],
  imports: [
    CommonModule,
    ReactiveFormsModule,
    AlertModule,
    CoreModule, // <- here
    RouterModule.forChild(routes),
  ],
})
export default class LoginModule {
  static routes = routes;
}

Angular2：未处理的承诺拒绝：没有@Injectable

2 个答案: