title: Angular ChangeDetection not working when injecting services via custom injector into dynamically generated components
body: <p>Since I haven't found any answer or similar case I'm posting this question here.</p>
  <p>My App has the following structure:</p>
  <ul>
  <li>AppModule
  <ul>
  <li>LayoutModule
  <ul>
  <li>MainComponent</li>
  <li>SidebarComponent</li>
  <li>SidebarService {providedIn: 'root'}</li>
  </ul>
  </li>
  <li>ContentModule
  <ul>
  <li>ContentComponent</li>
  <li>ContentService {providedIn: 'ContentModule'}</li>
  <li>ContentSidebarComponent</li>
  </ul>
  </li>
  <li>AnotherModule
  <ul>
  <li>AnotherComponent</li>
  <li>AnotherService {providedIn: 'AnotherModule'}</li>
  <li>AnotherSidebarComponent</li>
  </ul>
  </li>
  </ul>
  </li>
  </ul>
  <p>There are a lot more modules in the style of ContentModule and AnotherModule.</p>
  <p>Inside the SidebarComponent is a view container used for dynamic component generation.</p>
  <p>The SidebarService contains a method like <code>generateSidebar(component: any): void</code> which is called inside ContentComponent: <code>generateSidebar(ContentSidebarComponent)</code> and AnotherComponent: <code>generateSidebar(AnotherSidebarComponent)</code> and handles the dynamic component loading like this:</p>
  <p><strong>Dynamic Component Loader with custom injector</strong></p>
  <pre><code>const componentFactory = this.componentFactoryResolver.resolveComponentFactory(...);
  
  const viewContainerRef = viewContainer.viewContainerRef;
  viewContainerRef.clear();
  
  let componentRef: ComponentRef&lt;any&gt;;
  let injector: Injector|undefined = undefined;
  
  injector = Injector.create({
    providers: [
      {
        provide: ContentService,     //AnotherService respectively
        useClass: ContentService,    //AnotherService respectively
        deps: []
      }
    ]
  })
  
  componentRef = viewContainerRef.createComponent(
    componentFactory,
    0,
    injector
  );
  </code></pre>
  <p>There is no error like &quot;No provider for ...&quot;.</p>
  <p>When accessing the ContentComponent, ContentSidebarComponent is generated inside SidebarComponent properly.</p>
  <p>When accessing the AnotherComponent, AnotherSidebarComponent is generated inside SidebarComponeent properly.</p>
  <p><strong>The Problem</strong>
  ContentService is also used inside ContentComponent, and there are some properties of ContentService that get changed. It seems like ChangeDetection is not working in the ContentSidebarComponent because the properties of ContentService aren't changing there.</p>
  <p>By the way: Both services throw errors if there are multiple instances. So this is not the case and not the problem.</p>
  <p>How can I trigger ChangeDetection inside the dynamically generated component when a value of a property of an injected service changes?</p>
  <p>Thanks in advance.</p>