1

For example, I use router-link like this:

<li><a [router-link]="['/start']">Start</a></li>

But how can I change the router to /start by typescript?

peterh
  • 11,875
  • 18
  • 85
  • 108
gastrodia
  • 11
  • 1
  • 3
  • Here is a routing example: http://www.syntaxsuccess.com/viewarticle/routing-in-angular-2.0 – TGH Jul 24 '15 at 12:31

2 Answers2

4

Small update related to hash location strategy.

In recent versions of angular2 the bind method is deprecated so you can change location strategy by using provide method.

bootstrap(MyApp, [
  ROUTER_PROVIDERS,provide(LocationStrategy, {useClass: HashLocationStrategy})
]);
Slyvain
  • 1,732
  • 3
  • 23
  • 27
przemcio
  • 387
  • 3
  • 11
3

I believe you're asking how to configure your routes in Angular 2.

  • 1) import & load your router
  • 2) Use @RouteConfig to setup your routes on a component

  • Optional: Add a hashbang (#) to your url

Here's an example:

import {Component, View, bind, bootstrap} from 'angular2/angular2';
import {routerInjectables, routerDirectives, Router, RouteConfig} from 'angular2/router';
import {LocationStrategy, Location, HashLocationStrategy } from 'angular2/router'; // options2: HTML5LocationStategy

// Components
import {Home} from 'home';
import {SomewhereElse} from 'somePlace';

@Component({
  selector: 'app-name'
})
@View({
  template: '<router-outlet></router-outlet>',
  directives: [routerDirectives]
})
@RouteConfig([
  {path: '/start', as:  component: Home},
  {path: '/place/:placeId', component: SomewhereElse}
])
class AppName {}

bootstrap(AppName, [
  routerInjectables,
  bind(LocationStrategy).toClass(HashLocationStrategy) // for hashbang routes (/#/)
  // alternative: use HTML5LocationStrategy
]);
Uli Köhler
  • 13,012
  • 16
  • 70
  • 120
shmck
  • 5,129
  • 4
  • 17
  • 29
  • came here looking for how to setup hashbang routes and found this, even though it was not part of the question - thanks :) – Per Hornshøj-Schierbeck Aug 04 '15 at 22:14
  • And as per @shmck's helpful answer [here](http://stackoverflow.com/a/32003957/1450420) `routerInjectables` was changed to `ROUTER_PROVIDERS` – Derek Hill Nov 17 '15 at 20:19
  • To those who are at the very beginning of their journey to the fabulous world of Angular 2: order does matter - `ROUTER_PROVIDERS` should go before `LocationStrategy`. Otherwise it wont work. (spent an hour figuring this out) – Andrey Agibalov Dec 23 '15 at 18:08