When to use @angular tags in Angular 2? [duplicate

Question

This question already has an answer here:

• What is @angular in Angular 2? 5 answers

I was trying to bootstrap my application using code below in a boot.ts file:

import {bootstrap}    from 'angular2/platform/browser'
import {ROUTER_PROVIDERS} from 'angular2/router'

import {AppComponent} from './app.component'

bootstrap(AppComponent,[ROUTER_PROVIDERS]);

It worked fine.

Now I wanted to try and add Google Maps so imported angular2-google-maps package , created a map.component.ts file and added this to the router mapping (defined in the app.component.ts file).

For the above package, import {bootstrap} from '@angular/platform-browser-dynamic'; is used in the plunker code (provided as a starter code).

Now the map is displaying if I add a <map> selector in my index.html page.

I want it to follow the routing which was defined earlier.

Bootstrapping is also happening twice (once for the AppComponent and once for the Map)

How to bootstrap the map component properly so that bootstrapping happens only for the Main app?

Also what is the difference between @angular and angular2 packages and when to use them?

Answer 1

@angular is for RC (release candidate) versions and angular2 for beta versions.

In RC versions, for example, angular2/core becomes @angular/core. You can also notice that the SystemJS configuration is different since you don't have bundled JS files.

Now you need to configure Angular2 modules into map and packages blocks of your SystemJS configuration. See this link for more details:

• https://angular.io/guide/quickstart

Answer 2

This is new for Angular2 versions after beta.x, and therefore => Angular2 RC.0

Versions <= Angular2 beta.x use angular2