如果用户未登录Angular2 2.0.0-rc.4，则重定向到登录路由 [英] Redirect to login route if the user not logged in Angular2 2.0.0-rc.4

问题描述

这是我的html文件

<div class="container">
  <h1>Dohatec Data</h1>
  <div class="navLinks">
    <a [routerLink]="['/home']">Home</a>&nbsp;
    <a [routerLink]="['/about']">About-Us </a>&nbsp;
    <a [routerLink]="['/price']">Pricing</a>
  </div>
</div>

这是我的RouterConfig.

const routes: RouterConfig = [
  { path: '', redirectTo: 'home', terminal: true },
  { path: 'home', component: HomeComponent },
  { path: 'about', component: AboutUsComponent },
  { path: 'price', component: PriceComponent },
  { path: 'login', component: LoginComponent }
];

如果用户未在/home路由中登录，我想重定向用户.我可以在RouterConfig中做到吗?我不想使用canActivate: [LoggedInGuard]，因为它会限制在路线

之前

解决方案

1.将用户存储在本地存储或cookie中，您可以检查用户是否从组件的ngoninit上登录. 基于此，如果用户未登录，则可以重定向到登录页面.

2.如果用户已登录，则可以在服务中将变量设置为true，并以此为基础，您可以重定向到登录页面.

我希望这就是您要搜索的内容:)

您的答案:-

您可以在路由中使用canActivate和canDeactivate属性.首先，将名为isLoggedIn的变量设置为false，并在登录时将其设置为true，然后您可以通过添加canActivate方法为:-

在您的路线文件中的第三个属性:..

canActivate:[Authentication]

并从另一个文件中导入身份验证.....

import { CanActivate, Router } from '@angular/router';

export class Authentication implements CanActivate {

constructor(private service: Service, private router: Router) {}


canActivate() {

    if (this.authService.isLoggedIn) { return true; }
    this.router.navigate(['/login']);
    return false;
  }
}

This is my html file

<div class="container">
  <h1>Dohatec Data</h1>
  <div class="navLinks">
    <a [routerLink]="['/home']">Home</a>&nbsp;
    <a [routerLink]="['/about']">About-Us </a>&nbsp;
    <a [routerLink]="['/price']">Pricing</a>
  </div>
</div>

This is my RouterConfig.

const routes: RouterConfig = [
  { path: '', redirectTo: 'home', terminal: true },
  { path: 'home', component: HomeComponent },
  { path: 'about', component: AboutUsComponent },
  { path: 'price', component: PriceComponent },
  { path: 'login', component: LoginComponent }
];

I want to redirect the users if they are not loggedin in the /home route. Can I do it in the RouterConfig? I dont want to use canActivate: [LoggedInGuard] because it restricts before the route

解决方案

1.store the user in local storage or cookie and you can check if the user is logged in from there on ngoninit of your component.. on basis of this you can redirect to login page if user is not logged in.

2.you can make a variable in service to be true if user is logged in and on basis of this u can redirect to login page .

i hope this is what u are searching for :)

YOUR ANSWER :-

You can use a canActivate and canDeactivate property in your routes.. first of all set a variable named isLoggedIn as false and make it true on login and u can restrict the user by this by adding canActivate method as :-

in your routes file third property :..

canActivate:[Authentication]

and import authentication from another file .....

import { CanActivate, Router } from '@angular/router';

export class Authentication implements CanActivate {

constructor(private service: Service, private router: Router) {}


canActivate() {

    if (this.authService.isLoggedIn) { return true; }
    this.router.navigate(['/login']);
    return false;
  }
}

这篇关于如果用户未登录Angular2 2.0.0-rc.4，则重定向到登录路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！