Angular run multiple apps in 1 project, Optionality bootstrap components

most posts you'll find talk about actually managing 2 totally different apps under 1 project, and that's best described here: .

but what i really want to achieve is behavior more close to angular 1.x where you could write like 50 directives / components and put just set the ng-app attribute in your Aspx master page and it would just catch whatever is in, so in each page there were 2-10 directives and all was good.

with the angular-cli today its not native possible, but kouasda found a solution, where you test the page for the your angular tags and bootstrap them accordingly, as told in this issue and shown in this plnk.

eventually your app.module should look like this

import {BrowserModule, DOCUMENT} from '@angular/platform-browser'
import {NgModule, Inject, ApplicationRef} from '@angular/core'

import {AppRootOne} from './app-root-one.component'
import {AppRootTwo} from './app-root-two.component'
  imports: [ BrowserModule ],
  declarations: [ AppRootOne, AppRootTwo ],
  entryComponents: [ AppRootOne, AppRootTwo ]
export class AppModule {
  private browser_document;
         .getElementsByTagName('app-root-one').length > 0){

         .getElementsByTagName('app-root-two').length > 0){

  constructor(@Inject(DOCUMENT) private document: any){
    this.browser_document = document;


Popular posts from this blog

Asp.Net Ending Response options, Response.End() vs CompleteRequest()

c# Service Play Sound with NAudio example by Moshe

JS/JQ simulate Enter event