title: Angular 2 Routing issue, routes to blank page
body: <p>I am having an issue with the new Angular 2 router. I have a button click event that calls a function to route to a dashboard page from a login component. both are child components of the main app component. when I click the button and the function fires I use the navigateByUrl() function to navigate to the dashboard page from the login. but when that function is called, the browser url shows localhost:52370/dashboard? and a black page in the browser. Im not sure where this problem originates from. here is my app.routes.ts file</p>
  
  <pre><code>const appRoutes: Routes = [
  { path: "", component: HomeComponent },
  { path: "home", redirectTo: "" },
  { path: "login", component: LoginComponent },
  { path: "dashboard", component: DashboardComponent },
  ];
  
  export const AppRoutingProviders: any[] = [];
  export const AppRouting: ModuleWithProviders = RouterModule.forRoot(appRoutes);
  </code></pre>
  
  <p>login.component.ts file</p>
  
  <pre><code>constructor(private router: Router, private route: ActivatedRoute) { }
  
  public login() {
      this.loginStatus = true;
      this.onLogin.emit(this.loginStatus);
      this.router.navigateByUrl("dashboard")
          .then(function () {
              console.log("success");
          }).catch(function (err) {
              console.log(err);
          });
  }
  </code></pre>