小编Ank*_*ush的帖子

我有一个关于Angular 2路由器的小问题,3.0.0-rc.1我希望根据用户角色(例如AdminComponent或UserComponent)导航到不同的主组件.任何人都可以帮助修改以下路线,以便我可以实现所需的功能吗？

{path: 'login', component: LoginComponent},  // <--- This redirects to '/' in case user is logged in
{
  path: '',
  component: HomeComponent,               
  canActivate: [AuthGuardService],  // <--- Check if user is logged in, else redirect to login
  children: [
    {
      path: '',
      component: AdminComponent  // <--- Want to navigate here if user role is 'admin'
    },
    {
      path: '',
      component: UserComponent  // <--- Want to navigate here if user role is 'user'
    }
  ]
}

AuthGuardService.ts

import {Injectable} …

我正在使用以下文件结构的Angular 2项目.

• HeaderComponent.ts
• AppComponent.ts
• Page1Component.ts
• Page2Component.ts

我在HeaderComponent.ts中有以下模板

<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">WebSiteName</a>
        </div>
        <div class="collapse navbar-collapse" id="myNavbar">
            <ul class="nav navbar-nav">
                <li class="active"><a [routerLink]="['']">Home</a></li>
                <li><a [routerLink]="['/page1']" >Page1</a></li>
                <li><a [routerLink]="['/page2']">Page2</a></li>
            </ul>
        </div>
    </div>
</nav>

在我的AppComponent中使用以下路由

@Component({
    selector: 'my-app',
    template: ` 
            <my-header></my-header>
            <router-outlet></router-outlet>
    `,
    directives: [ROUTER_DIRECTIVES, HeaderComponent]
})
@Routes([
    {path: '/', component: HomeComponent},
    {path: '/page1', component: Page1Component}
    {path: '/page2', component: Page2Component}
])
export class …

我使用Angular 2实现了一个登录页面.登录后,我从服务器获取jsonwebtoken,userId,userRole,userName.我将此信息存储在localstorage中,以便我可以随时访问它并在用户刷新页面时保持登录状态.

AuthService.ts

import {Injectable} from "@angular/core";

@Injectable()
export class AuthService {
  redirectUrl: string;

  logout() {
    localStorage.clear();
  }

  isLoggedIn() {
    return localStorage.getItem('token') !== null;
  }

  isAdmin() {
    return localStorage.getItem('role') === 'admin';
  }

  isUser() {
    return localStorage.getItem('role') === 'user';
  }

}

要检查登录状态,我只是检查localstorage中是否存在令牌.由于localstorage是可编辑的,因此只需在localstorage中添加任何令牌即可绕过登录页面.同样,如果客户端在localstorage中编辑用户角色,客户端可以轻松访问管理员或用户页面.

我该如何解决这些问题？

这更像是一般问题,我想知道网站如何保持登录状态？

PS NodeJS Server端登录代码生成jsonwebtoken

const jwt = require('jsonwebtoken');
const User = require('../models/User');

/**
 * POST /login
 * Sign in using username and password
 */
exports.postLogin = (req, res, next) => {
    User.findOne({username: req.body.username})
        .then(user=> {
            if (!user) { …

RxJS github repo解释了如何从事件或数组创建observable.我知道如何用异步或Promise替换回调地狱,但我找不到一个关于如何创建和返回我的函数执行异步任务的observable的示例.

例如,

x = getData();
y = getMoreData(x);
z = getMoreData(y);
...

getData(function(x){
    getMoreData(x, function(y){
        getMoreData(y, function(z){ 
            ...
        });
    });
});

如何用observable替换这个回调地狱？我发现我们可以在RxJS github中调用observer.next()方法- 创建observable但是无法找出这个例子的实现.

如果一个observable转换为promise,我如何取消订阅？我在Angular 2中使用RxJS

import 'rxjs/add/operator/toPromise';

return this.http.get(this.heroesUrl)
                  .toPromise()
                  .then(this.extractData)

List<String> listA = new Arraylist();
List<String> listB = new Arraylist();

鉴于以上2个列表,我想迭代并在每个元素上调用相同的方法.

选项1

for(String aStr: listA){
    someCommonMethodToCall(aStr);
    someCommonMethodToCall(aStr);
    ...
}
for(String bStr: listB){
    someCommonMethodToCall(bStr);
    someCommonMethodToCall(bStr);
    ...
}

要么

选项2

List<String> mergedList = new ArrayList();
mergedList.addAll(listA);
mergedList.addAll(listB);

for(String elem: mergedList){
    someCommonMethodToCall(elem);
    someCommonMethodToCall(elem);
    ...
}

要么

选项3

我认为选项1应该是最好的.是否有一些Java 8 lambda方法可以做到这一点？此外,性能方面,还有什么比选项1更好？