Question

我已经做了一名管理员。我正在调用一个api并提取ID。

我必须相应地返回true或false。我不能将return放入回调中。如果我这样做，则会收到错误消息“函数必须返回值”。它不会在回调中接收return语句。

现在此代码不起作用，因为在回叫完成之前和获取正确的数据之前，将在回调的if语句之外执行该代码。我该怎么办？

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree } from '@angular/router';
import { Observable } from 'rxjs';
import { AuthService } from '../services/auth.service'

@Injectable({
  providedIn: 'root'
})
export class AdminGuard implements CanActivate {
userDetail: any;
isAdmin = false;
  constructor( 
    private authService: AuthService
  ) {}

  canActivate(

    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
      this.authService.getUserProfile().subscribe((res: any)=>{
        this.userDetail = res.data;
        if(this.userDetail.id == 2) {
          this.isAdmin = true;
        }
      });
      if(this.isAdmin) {
        return true;
      } else {
        return false;
      }
  }

}

Answer 1

您不应该订阅。 Angular将为您处理订阅：

canActivate(): Observable<boolean> {
  return this.authService.getUserProfile().pipe(
    take(1), // add this if your authService doesn't complete after getting profile
    map((res) => res.data.id == 2)
  );
}

Answer 2

Serial可以是CanActivate或Observable<boolean>或Promise<boolean>。考虑到这一点，您可以返回承诺或可观察的结果。

我会这样使用Boolean：

promise

尝试通过使用管理员防护并在其中调用和api来验证数据来保护路由

2 个答案: