I have the following routes defined in my app ...
app.components.ts
@RouteConfig([
{path:'/employees/...', name:'Employees', component:EmployeeComponent},
...
employee.component.ts
@RouteConfig([
{path:'/', name:'EmployeeList', component:EmployeeListComponent, useAsDefault: true},
{path:'/:id', name:'EmployeeDetail', component:EmployeeDetailComponent}
])
When I route from the EmployeeDetailComponent template ...
<button class="btn btn-default" [routerLink]="['EmployeeList']">Close</button>
the app routes to the employee listing page as expected.
However, when I route using router.navigate ...
// template
<button class="btn btn-default" (click)="save()">Save</button>
// EmployeeDetailComponent
saveEmployee() {
this._employeeServer.updateEmployee(this.employee);
this._router.navigate(['EmployeeList']);
}
the app routes the the employee listing (as expected) and then, a few moments later, the app reloads entirely (not as expected).
Any idea why router.navigate is behaving differently than routerLink? What am I missing?