How to use bootstrap in Angular 2 with vanilla js/es6?

Question

I'm trying to implement an Angular 2 app without TypeScript and I'm stuck in how to bootstrap it (can find any example).

My app (without the bootstrap()) starts with:

export class MyApp {
  static get parameters() {
    return [[Http], [Platform], [IonicApp]];
  }

  constructor(http, platform, app) {

  }
}

this works ok. But, let's say, I have a CustomService. How would I do to inject it to MyApp?

I tried with:

bootstrap(myApp, [SomeCustomService]);

but the console logs: EXCEPTION: No provider for Http! (MyApp -> Http)

I'm I missing something? Did I understood worng some concepts?

Bro, to which file are you adding this line - bootstrap(myApp, [SomeCustomService]); ? — Raja Yogan
– Raja Yogan, Commented Apr 26, 2016 at 19:51

Thierry Templier · Accepted Answer · 2016-04-26 20:51:44Z

1

You need to add HTTP_PROVIDERS when bootstrapping your application:

bootstrap(myApp, [HTTP_PROVIDERS, SomeCustomService]);

Note that with Ionic2, there is no need to bootstrap your application. You can simply specify global providers on the class decorated with @App:

@App({
  (...)
  providers: [HTTP_PROVIDERS, SomeCustomService]
})
export class MyApp {
  (...)
}

answered Apr 26, 2016 at 20:51

Thierry Templier

203k44 gold badges407 silver badges366 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

This is exactly what I was looking for!