Angular 2 0.44 router example

app.ts

import {provide, bootstrap} from 'angular2/angular2';
import {Component} from 'angular2/angular2';

import {CORE_DIRECTIVES} from 'angular2/angular2';
import {RouteConfig, ROUTER_DIRECTIVES, LocationStrategy, HashLocationStrategy, Location, RouterOutlet} from 'angular2/router';

import {ComponentA} from './componenta_folder/componenta';
import {ComponentB} from './componentb_folder/componentb';
import {ComponentC} from './componentc_folder/componentc';

@RouteConfig([
  { path: '/route0', component: ComponentA, as: 'ComponentA'},
  { path: '/route1', component: ComponentB, as: 'ComponentB'},
  { path: '/route2', component: ComponentC, as: 'ComponentC'}
])
@Component({
  selector: 'my-app',
  directives: [
    CORE_DIRECTIVES,
    ROUTER_DIRECTIVES
  ],
  template: `
        <ul>
          <li [class.is-active]="isLinkActive('/route0')">
            <a [router-link]="['./ComponentA']">Route0</a>
          </li>
          <li [class.is-active]="isLinkActive('/route1')">
            <a [router-link]="['./ComponentB']">Route1</a>
          </li>
          <li [class.is-active]="isLinkActive('/route3')">
            <a [router-link]="['./ComponentB']">Route2</a>
          </li>
       </ul>
       <router-outlet></router-outlet>
  `
})
class AppComponent {
  location: Location;
  constructor(location: Location) {
    this.location = location;
  }
  isLinkActive(path) {
    return this.location.path() === path;
  }
}

const APP_BINDINGS = [
  ROUTER_BINDINGS,
  provide(LocationStrategy, {useClass: HashLocationStrategy}),
  provide(ROUTER_PRIMARY_COMPONENT, {useValue: AppComponent})
];

bootstrap(
  AppComponent,
  APP_BINDINGS
  );