再会！
我有一个用于处理时间卡的 Angular 7 应用程序。我正在使用 CanActivate Guard 来输入组件。CanActivate 代码使用 Observable 来确定是否应该让它们通过或重定向。
timecardID: number;
constructor(private globals: Globals, private router: Router, private securityService: SecurityService) { }
canActivate(
next: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean | UrlTree> | boolean {
if (next.params.timecardId) {
this.timecardID = +next.params.timecardId;
return this.hasAccessToTimecard();
}
return this.empNumber === this.globals.empNumber;
}
//Does current user have access to this specific timecard
hasAccessToTimecard(): Observable<boolean | UrlTree> {
return this.securityService.hasRightsToTimecard(this.timecardID);
}
它调用的服务如下所示：
private readonly HasRightsToTimecardURI = 'api/Security/HasRightsToTimecard';
private readonly HasRightsToEmployeeURI = 'api/Security/HasRightsToEmployee';
constructor(private http: HttpClient, @Inject('BASE_URL') private baseUrl: string, private router: Router) { }
//I don't like the use of router to navigate here. But without it, on false return the UrlTree isn't used for redirections.
public hasRightsToTimecard(timecardID: number): Observable<boolean | UrlTree> {
let parameters = new HttpParams();
parameters = parameters.set('timecardID', String(timecardID));
return this.http.get<boolean | UrlTree>(this.baseUrl + this.HasRightsToTimecardURI, { params: parameters }).pipe(
tap((result) => {
this.router.navigate(['/home']);
return result ? result : this.router.createUrlTree(['/home']);
})
);
}
我已经验证了当 API 返回 false 时，会创建并返回 UrlTree 以及返回 true 的 API 结果也正常的逻辑。
但是，我的实际结果是，如果我尝试使用控件访问路由：
- 使用应用程序组件中的控件，我有正确的访问权限，守卫让我通过
- 使用应用程序组件中的控件，我没有正确的访问权限，守卫将我留在我所在的位置（拒绝我走那条路线）。什么时候应该重新路由我。
- 如果我试图通过在浏览器中键入它而直接在该路线上“着陆”，我只会得到一个空白的路由器插座。
谁能帮我？
另外：可能的相关路线（删除了其他项目）：
const routes: Routes = [
{
path: 'timecards', canActivateChild: [RightsGuard], children: [
{ path: 'edit/:timecardId', canActivate: [TimecardGuard], component: TimecardNewComponent }
]
}
];