CODEWITHSUNDEEP
angular
Bonomi
Bonomi

Reputation: 2753

Pass a param to my AppComponent at Bootstrap time

I'm working on a angular v7 app that is hosted on a asp.net application. Basically I will have a dropdown on my .net app and I want to call the angular one with the selected value. I did several attempts to pass a param at the bootstrap (app.module.ts) but am getting an error.

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  entryComponents: [AppComponent]
})
export class AppModule { 

  ngDoBootstrap(app: ApplicationRef) {
    document.addEventListener('myAppA', function(e : CustomEvent) {
        app.bootstrap(AppComponent, [{provide:'MESSAGE', useValue: 'Hello Angular'}]);
    });
  }
}

enter image description here

I believe there is a simple way to achieve it. Any ideas?

Upvotes: 0

Views: 492

Answers (2)

Passionate Coder
Passionate Coder

Reputation: 7294

I have found something. Pass default parameter values like this:

app.module.ts

ngDoBootstrap(app: ApplicationRef){
    let ref = app.bootstrap(AppComponent);
    ref['_component'].name= "updated name"
}

app.component.ts

export class AppComponent  {
  name = 'Angular 4';
}

Working link:

https://stackblitz.com/edit/angular-ngdobootstrap-8lygvr?embed=1&file=app/app.component.ts

Upvotes: 0

Bonomi
Bonomi

Reputation: 2753

I found the solution.

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [
    ConfigService
  ],
  entryComponents: [AppComponent]
})
export class AppModule implements DoBootstrap { 
  constructor(private config: ConfigService) { }

  ngDoBootstrap(app: ApplicationRef) {
    const self = this;
    document.addEventListener('myAppA', function(e : CustomEvent) {
      self.config.setScheme("BBB");
      app.bootstrap(AppComponent);
    });
  } 
}

Basically I create a service and inject it into the AppModule constructor. Then, before calling the bootstrap I set the values I want using the service. Could't find anything else.

Upvotes: 1

Related Questions