Question

在我的angular2应用程序中，我有几个模块，大多数超出根模块的是懒惰加载

Routes = [{
    path: '',
    redirectTo: '/home',
    pathMatch: 'full'
  },
  ...
  {
    path: 'item',
    loadChildren: 'app/item/item.module#ItemModule'
  }

在ItemModule中，我在＃34;＆＃34;

下列出了一个ItemSearchService

@NgModule({
imports:      [ 
...
],
declarations: [ 
  ItemDetailComponent,
  ItemComponent,
  ItemSearchComponent
],
exports:      [ 
],
providers:    [ 
  ItemSearchService
]
})

因此，根据我对模块结构的理解，ItemDetailComponent和ItemSearchComponent在构造函数中注入时应该获得相同的ItemSearchService实例。

export class ItemSearchComponent implements OnInit {
  constructor(private http: Http, private itemSearch: ItemSearchService ... )

export class ItemDetailComponent implements OnInit{
  constructor(private route: ActivatedRoute, private itemSearch: ItemSearchService ...)

然而，当我运行它时，只要我从IteamSearchComponent导航到ItemDetailComponent，ItemDetailComponent就会获得一个新的，单独的ItemSearchService实例，当然不是这样的。

当我在根模块中提供ItemSearchService时，一切正常，然后所有组件都获得相同的实例，但是当我将提供程序移动到ItemModule时，似乎出现了问题。

这是否与延迟加载的ItemModule有关？我在这里有点不知所措，现在这不是一个大问题，因为我可以在AppModule中提供服务作为应用程序范围的单例，但我不想从长远来看，我的所有服务都存在于根模块中，所以我在这里遗漏了一些东西吗？

Answer 1

在Angular 2中有groupby。

每个组件都有自己的注射器和注射器树填充父注射器。您可以在提供的链接中阅读更多相关信息。

如果您对服务的ctor进行调试，您会发现ctor被调用两次。每个组件一次。

Angular2服务：即使只有一个提供者，也可以在两个组件中获得不同的实例

1 个答案: