fix: use routerLink instead of imperative router.navigate

see angular/angular.io#998 for reasoning

Author: IgorMinar

src/client/app/+developers/+developer-details/developer-detail.html

@@ -224,13 +224,14 @@ <h3 class="mobmid">Leaderboard </h3>
     FOOTER
     =========================== -->
     <footer class="text-center">
-        <button type="submit" class="dashboard-button mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent"
-        (click)="onEdit(developer)">Edit Developer</button>
+        <button class="dashboard-button mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent"
+                [routerLink]="['DeveloperEdit', {id: developer.id}]">Edit Developer</button>
         &nbsp;
-        <button class="dashboard-button mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" (click)="gotoDevelopers()">Cancel</button>
+        <button class="dashboard-button mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect"
+                [routerLink]="['DevelopersListing']">Cancel</button>
     </footer>
     <div>
         <p></p>
     </div>
 
-</div>
+</div>

src/client/app/+developers/+developer-details/developer-detail.ts

@@ -1,5 +1,5 @@
 import {Component, Input, ChangeDetectionStrategy} from 'angular2/core';
-import {Router} from 'angular2/router';
+import {ROUTER_DIRECTIVES} from 'angular2/router';
 
 import {IDeveloper} from '../../developers';
 import {ValuesPipe} from '../../values-pipe';
@@ -9,18 +9,12 @@ import {ValuesPipe} from '../../values-pipe';
   selector: 'developer-details',
   templateUrl: 'app/+developers/+developer-details/developer-detail.html',
   inputs: ['developer'],
+  directives: [ROUTER_DIRECTIVES],
   pipes: [ValuesPipe],
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class DeveloperDetailComponent {
-  constructor(private _router: Router) {}
-
 
   @Input() developer: IDeveloper;
 
-  onEdit(developer: IDeveloper) {
-    this._router.navigate(['DeveloperEdit', {id: this.developer.id}]);
-  }
-
-  gotoDevelopers() { this._router.navigate(['DevelopersListing']); }
 }

src/client/app/+developers/developers.ts

@@ -22,7 +22,7 @@ import {DeveloperService} from '../developers';
     loader: () => window['System'].import('app/+developers/+developer-details').then((module) => module.DeveloperDetailsComponent)
   },
   {
-    path: '/developer-edit/',
+    path: '/developer-edit/:id',
     name: 'DeveloperEdit',
     loader: () => window['System'].import('app/+developers/+developer-edit').then((module) => module.DeveloperEditComponent)
   }

src/client/app/+events/+event-edit/event-edit.ts

@@ -4,6 +4,7 @@ import {Observable} from 'rxjs/Observable';
 
 import {IEvent, EventsService} from '../../events';
 import {DataService} from '../../data-service';
+
 import {EventEditFormComponent} from './event-editform';
 
 

src/client/app/app.ts

@@ -11,7 +11,7 @@ import {EventsService} from './events';
   selector: 'houston-app',
   templateUrl: 'app/app.html',
   viewProviders: [],
-  directives: [[ROUTER_DIRECTIVES]],
+  directives: [ROUTER_DIRECTIVES],
   providers: [
     ROUTER_PROVIDERS,
     DataService,