{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular/issues/11388","repository_url":"https://api.github.com/repos/angular/angular","labels_url":"https://api.github.com/repos/angular/angular/issues/11388/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular/issues/11388/comments","events_url":"https://api.github.com/repos/angular/angular/issues/11388/events","html_url":"https://github.com/angular/angular/issues/11388","id":175314367,"number":11388,"title":"Injecting a service in a lazy-loaded module trows an unknown provider error","user":{"login":"diestrin","id":909327,"avatar_url":"https://avatars.githubusercontent.com/u/909327?v=3","gravatar_id":"","url":"https://api.github.com/users/diestrin","html_url":"https://github.com/diestrin","followers_url":"https://api.github.com/users/diestrin/followers","following_url":"https://api.github.com/users/diestrin/following{/other_user}","gists_url":"https://api.github.com/users/diestrin/gists{/gist_id}","starred_url":"https://api.github.com/users/diestrin/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/diestrin/subscriptions","organizations_url":"https://api.github.com/users/diestrin/orgs","repos_url":"https://api.github.com/users/diestrin/repos","events_url":"https://api.github.com/users/diestrin/events{/privacy}","received_events_url":"https://api.github.com/users/diestrin/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":4,"created_at":"2016-09-06T18:15:11Z","updated_at":"2016-09-06T20:09:10Z","closed_at":null,"body":"**I'm submitting a ...**  (check one with \"x\")\r\n```\r\n[x] bug report => search github for a similar issue or PR before submitting\r\n[ ] feature request\r\n[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question\r\n```\r\n\r\n**Current behavior**\r\nInjecting a service in a lazy-loaded module throws an unknown provider error\r\n\r\n**Expected/desired behavior**\r\nInjecting a service in a lazy-loaded module injects the service\r\n\r\n**Reproduction of the problem**\r\nI have created a code to dynamically bootstrap modules in my page (we have a custom set up that lazy load the components as they apear in the screen).\r\n\r\nThis code works fine and do the task, but I have a problem, when I include an NgModule in the `imports` of one of the bootstrapped modules, the injector doesn't recognize the services declared in the imported module. Only if I include the NgModule (the one with a service) in the root module, it gets injected correctly.\r\n\r\nHere's a summary of the code that bootstraps with custom selector\r\n```\r\n@NgModule({\r\n  providers: [SystemJsNgModuleLoader],\r\n  imports: [BrowserModule]\r\n})\r\nclass AppModule {\r\n  ngDoBootstrap() {}\r\n}\r\n\r\nconst modulePath = './src/test#TestModule';\r\nconst moduleSelector = '#testId';\r\n\r\nplatformBrowserDynamic()\r\n.bootstrapModule(AppModule)\r\n.then(appModule => {\r\n  const ngModuleLoader = appModule.injector.get(SystemJsNgModuleLoader);\r\n  return ngModuleLoader.loadAndCompile(modulePath)\r\n  .then(moduleFactory => ({moduleFactory, appModule}));\r\n})\r\n.then(({moduleFactory, appModule}) => {\r\n  let injector = appModule.injector;\r\n  const ngModule = moduleFactory.create(injector);\r\n  const app = ngModule.injector.get(ApplicationRef);\r\n\r\n  ngModule.bootstrapFactories.forEach(comp => {\r\n    comp.selector = moduleSelector;\r\n    app.bootstrap(comp);\r\n  });\r\n});\r\n```\r\n\r\nHere's a [plnkr](http://plnkr.co/edit/Ylv04QMyzeeNrQQh7yrE?p=preview) with the example working (NgModule imported in the root module)\r\nHere's a [plnkr](http://plnkr.co/edit/nBuVVY?p=preview) with the example failing because a missing provider (NgModule imported in the dynamically bootstrapped modules)\r\nHere's a [plnkr](http://plnkr.co/edit/o9hTH29vjp6BPBda6QwO?p=preview) working correctly without lazy-load with custom selector\r\n\r\n**What is the expected behavior?**\r\nThe Service imported in a lazy loaded module should be injected in that lazy loaded module.\r\nRight now, only moving the import declaration to the root module gets the Service to be injected\r\n\r\n**Please tell us about your environment:**\r\n\r\n* **Angular version:** 2.0.0-rc.6\r\n\r\n* **Browser:** [all]\r\n\r\n* **Language:** [TypeScript 1.8]"},"comment":{"url":"https://api.github.com/repos/angular/angular/issues/comments/245074299","html_url":"https://github.com/angular/angular/issues/11388#issuecomment-245074299","issue_url":"https://api.github.com/repos/angular/angular/issues/11388","id":245074299,"user":{"login":"kemsky","id":3826972,"avatar_url":"https://avatars.githubusercontent.com/u/3826972?v=3","gravatar_id":"","url":"https://api.github.com/users/kemsky","html_url":"https://github.com/kemsky","followers_url":"https://api.github.com/users/kemsky/followers","following_url":"https://api.github.com/users/kemsky/following{/other_user}","gists_url":"https://api.github.com/users/kemsky/gists{/gist_id}","starred_url":"https://api.github.com/users/kemsky/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kemsky/subscriptions","organizations_url":"https://api.github.com/users/kemsky/orgs","repos_url":"https://api.github.com/users/kemsky/repos","events_url":"https://api.github.com/users/kemsky/events{/privacy}","received_events_url":"https://api.github.com/users/kemsky/received_events","type":"User","site_admin":false},"created_at":"2016-09-06T20:09:10Z","updated_at":"2016-09-06T20:09:10Z","body":"If my understanding is correct, you are loading two modules: Test and Test2, which have dependency on ServiceModule, but in fact you are lazy loading three modules: Test, Test2 and their dependency - ServiceModule. Thats it, all three were lazy loaded."}}
{"actor":{"display_login":"kemsky"}}