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

查看:22
本文介绍了如果用户未登录 Angular2 2.0.0-rc.4,则重定向到登录路由的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是我的html文件

<h1>Dohatec 数据</h1><div class="navLinks"><a [routerLink]="['/home']">首页</a>&nbsp;<a [routerLink]="['/about']">关于我们</a>&nbsp;<a [routerLink]="['/price']">定价</a>

这是我的 RouterConfig.

const 路由:RouterConfig = [{路径:'',重定向到:'家',终端:真},{ path: 'home', 组件: HomeComponent },{ path: 'about', 组件: AboutUsComponent },{路径:'价格',组件:价格组件},{ 路径:'登录',组件:LoginComponent }];

如果用户没有登录/home 路由,我想重定向他们.我可以在 RouterConfig 中做吗?我不想使用 canActivate: [LoggedInGuard] 因为它限制在路由之前

解决方案

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

2.如果用户已登录,您可以在服务中设置一个变量为真,并在此基础上您可以重定向到登录页面.

我希望这就是你正在寻找的 :)

你的答案:-

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

在你的路由文件中的第三个属性:...

canActivate:[认证]

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

import { CanActivate, Router } from '@angular/router';导出类身份验证实现 CanActivate {构造函数(私有服务:服务,私有路由器:路由器){}可以激活(){if (this.authService.isLoggedIn) { return true;}this.router.navigate(['/login']);返回假;}}

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆