基于角色的Angular 4路由默认页面

Sri*_*iks 2 authentication angular2-routing angular

我的路线定义如下:

const appRoutes: Routes = [
 {
  path: 'teacher',
  component: 'TeacherComponent'
 },
{
  path: 'student',
  loadChildren: './components/student/student.module#StudentModule',
  canLoad: [AuthGuard]
},
{ path: '**',   redirectTo: '/' }
];
Run Code Online (Sandbox Code Playgroud)

我想根据登录用户角色来路由默认路由。如果是学生,我想默认设置我的路径:“ **”,将其重定向到“ / student”。同样,对于教师角色,我希望它默认为“ / teacher”。如何通过默认路由到基于角色的不同URL来实现基于角色的导航?

Deb*_*ahK 5

您可以使用路由解析器。

这是我的一个:

import { Injectable } from '@angular/core';
import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';

import { Observable } from 'rxjs/Observable';

import { IMovie } from './movie';
import { MovieService } from './movie.service';

@Injectable()
export class MovieResolver implements Resolve<IMovie> {

    constructor(private movieService: MovieService) { }

    resolve(route: ActivatedRouteSnapshot,
            state: RouterStateSnapshot): Observable<IMovie> {
        const id = route.paramMap.get('id');
        return this.movieService.getMovie(+id);
    }
}
Run Code Online (Sandbox Code Playgroud)

此代码将阻止路线继续,直到检索到影片为止。

您可以执行类似的操作来检索角色。然后,您可以使用检索到的数据来激活不同的路由,而不仅仅是返回它,这取决于用户的角色。