What's the proper way to set a Router & RouterLink in Angular2 Dart

As of Angular Dart 2.0.0 (release candidate), the correct syntax for a router link is:

<a [router-link]="['./Home']">Go Home</a>

The value is a list of arguments that are passed to Router.navigate().

The correct syntax for configuring routes is:

@Component(    selector: 'my-app',    template: ...,    directives: const [ROUTER_DIRECTIVES],    providers: const [HeroService, ROUTER_PROVIDERS])@RouteConfig(const [  const Route(      path: '/dashboard',      name: 'Dashboard',      component: DashboardComponent,      useAsDefault: true),  const Route(      path: '/detail/:id', name: 'HeroDetail', component: HeroDetailComponent),  const Route(path: '/heroes', name: 'Heroes', component: HeroesComponent)])class AppComponent {  String title = 'Tour of Heroes';}

app/partials/phone-list.html:

<div class="container-fluid">  <div class="row">    <div class="col-md-2">      <!--Sidebar content-->      Search: <input ng-model="query">      Sort by:      <select ng-model="orderProp">        <option value="name">Alphabetical</option>        <option value="age">Newest</option>      </select>    </div>    <div class="col-md-10">      <!--Body content-->      <ul class="phones">        <li ng-repeat="phone in phones | filter:query | orderBy:orderProp" class="thumbnail">          <a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="{{phone.imageUrl}}"></a>         <a href="#/phones/{{phone.id}}">{{phone.name}}</a>          <p>{{phone.snippet}}</p>        </li>      </ul>    </div>  </div></div>

check out @ngrx/router it's an simpler router implementation for Angular 2https://github.com/ngrx/router

you can see how simple it is to declare routes

import { Routes } from '@ngrx/router';const routes: Routes = [  {    path: '/',    component: HomePage  },  {    path: '/blog',    component: BlogPage,    children: [      {        path: ':id',        component: PostPage      }    ]  }]

and here is a demo plunker http://plnkr.co/edit/7J6RrA?p=preview