CODEWITHSUNDEEP
angular
TheUnreal
TheUnreal

Reputation: 24472

Angular 2 RC4 to RC5 bootstrapping

I have the following main.ts file since Angular 2 RC4:

import { bootstrap } from '@angular/platform-browser-dynamic';
import { enableProdMode,provide } from '@angular/core';
import {disableDeprecatedForms, provideForms} from '@angular/forms'; 
import {RequestOptions,HTTP_PROVIDERS} from '@angular/http';
import { AppComponent, environment } from './app/';
import { appRouterProviders } from './app/app.routes';
import {CustomRequestOptions} from "./app/custom-request-options";
import { Title } from '@angular/platform-browser';

if (environment.production) {
  enableProdMode();
}

bootstrap(AppComponent, [
  appRouterProviders,
  disableDeprecatedForms(),
  provideForms(),
  HTTP_PROVIDERS,
  provide(RequestOptions, {useClass: CustomRequestOptions}),
  Title
])
.catch(err => console.error(err));

Now.. I need to have it all as a module. so I created app.module.ts file

import { NgModule }       from '@angular/core';
import { BrowserModule  } from '@angular/platform-browser';
import { AppComponent }   from './app.component';

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

How I can import all my providers and declrations from the following line:

bootstrap(AppComponent, [
  appRouterProviders,
  disableDeprecatedForms(),
  provideForms(),
  HTTP_PROVIDERS,
  provide(RequestOptions, {useClass: CustomRequestOptions}),
  Title
])

to work in the module?

Upvotes: 5

Views: 2574

Answers (1)

Thierry Templier
Thierry Templier

Reputation: 202246

With RC5, you need to bootstrap this way:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';

platformBrowserDynamic().bootstrapModule(AppModule);

Just move your providers to the ones of the module (providers attribute):

@NgModule({
  (...)
  providers: [
    provide(RequestOptions, {useClass: CustomRequestOptions}),
    Title
  ]
})

For forms, HTTP,routing, simply include the corresponding modules from Angular2:

@NgModule({
  (...)
  imports: [
    BrowserModule, 
    RouterModule.forRoot(config), 
    FormsModule, 
    HttpModule, // provides HTTP_PROVIDERS
  ]
})

See the migration doc for more details:

Upvotes: 7

Related Questions