title: angular 2 redirect using router.navigate
body: <p>I'm new to angular 2 and trying to create a login app which I managed okay however after checking user/pass then redirect to dashboard it reloads the app. Is there a way to not refresh the page using router.navigate?</p>
  
  <p>Edit: it redirects to dashboard first then reloads the page then redirects again back to dashboard.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { Component } from '@angular/core';
  import { Router, ROUTER_DIRECTIVES } from '@angular/router';
  
  @Component({
      selector: 'login',
      templateUrl: './app/login/views/login.html',
  })
  
  export class LoginComponent {
      constructor(public router: Router) {}
      data = {
          username: "",
          password: "",
      };
      loginAction (){
          if(this.data.username=="user1" &amp;&amp; this.data.password=="pass1"){
              console.log('do redirect to dashboard');
              this.router.navigate(['dashboard']);
          } else {
              console.log('Something is wrong with your user/password.');
          }
      }
  }</code></pre>
  </div>
  </div>
  </p>