title: Angular 2 Auth guard breaks redirect
body: <p>This is my <code>app-routing.module.ts</code>:</p>
  
  
  
  <pre class="lang-ts prettyprint-override"><code>const routes: Routes = [
    { path: '', redirectTo: '/app/elements', pathMatch: 'full' },
    {path: 'app', component:ElementsComponent, children:[
      { path: 'details/:id', component: ElementDetailComponent, canActivate:[AuthGuard]},
      { path: 'elements',     component: ElementListComponent, canActivate:[AuthGuard] },
  
      { path: 'user/signup',     component: SignupComponent },
      { path: 'user/login',     component: LoginComponent },
      { path: 'user/logout',     component: LogoutComponent }
    ]}
  
  ];
  @NgModule({
    imports: [ RouterModule.forRoot(routes) ],
    exports: [ RouterModule ],
    providers: [AuthGuard]
  })
  export class AppRoutingModule {}
  </code></pre>
  
  <p>As you can see for the path <code>''</code> I am redirecting to <code>/app/elements</code> which is kind of my home page. This was working fine until I implemented the <code>AuthGuard</code> which looks like:</p>
  
  <pre class="lang-ts prettyprint-override"><code>@Injectable()
  export class AuthGuard implements CanActivate{
  
    public allowed: boolean;
  
    constructor(private af: AngularFire, private router: Router) { }
  
  
    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
      this.af.auth.subscribe((auth) =&gt;  {
        if(auth == null) {
          this.router.navigate(['/app/user/login']);
          this.allowed = false;
        } else {
          this.allowed = true;
        }
      });
      return this.allowed;
    }
  }
  </code></pre>
  
  <p>Now, if the user is not logged in and goes to <code>http://localhost:4200/</code>, the redirect works and it tries to go to <code>http://localhost:4200/app/elements</code>, the guard detects the user is not logged in and it redirects to the login page.</p>
  
  <p>The problem is if the user <strong>is</strong> logged in and tries to go to <code>http://localhost:4200/</code>. In this case, nothing happens, the user stays at that URL with the page blank.</p>
  
  <p>Why the redirect is not working in that case? Is there a way to fix that?</p>