路由器不导航到目标组件

Router does not navigate to targeted component

我有一个功能,如果用户的状态为 complete,则将用户重定向到页面 Orders,如果用户的状态不是 [=16],则重定向到 HOME 页面=].

Orders页面有一个实现canActivateGuardServiceHOME页面没有任何守卫。

我有一些拥有 R_ORDERS 权限且处于 complete 状态的用户根本没有导航。 (即它们既不会路由到 Orders 页面,也不会路由到 HOME 页面)。

我可以看到调用了检索用户权限的 HTTP 请求,但它们卡在该页面中。

我的问题与此 post 相关吗?

或到本文 enter link description here

此外,我尝试在可观察对象完成时添加日志,但在那种情况下,日志永远不会显示在控制台中。

return this.getList().subscribe((e) => {
        const right = new List(e).FirstOrDefault(
          (d) => d.code == securizedPath.keyCode
        )?.type;
        if (!right) return resolve("OFF");
        return resolve(right);
      },
        (error) => {
          console.log("Right store threw an error");
          console.log(error);
        },
        () => {
          console.log("Right list completed")
        }
);

感谢您的帮助

async redirectTo() {
  this.loading = true;
  this.userState = await this.stateService.getToPromise(this.userId);


  if (this.userState.isComplete) {
     this.orderService.init();
     this.router.navigate([RouteNames.ORDERS]);
     this.loading = false;
     return;
  }

  this.router.navigate([RouteNames.HOME]);
  return;
  
}

RouteNames.ORDERS 有以下守卫:

@Injectable({
  providedIn: "root",
})
export class GuardService implements CanActivate {
  constructor(
    private router: Router,
    private rightService: UserRightService
  ) {}
  canActivate(
    route: import("@angular/router").ActivatedRouteSnapshot,
    state: import("@angular/router").RouterStateSnapshot
  ):
    | boolean
    | import("@angular/router").UrlTree
    | import("rxjs").Observable<boolean | import("@angular/router").UrlTree>
    | Promise<boolean | import("@angular/router").UrlTree> {
    return this.test(route);
  }
  async test(route: ActivatedRouteSnapshot) {
    const right = await this.rightService.isRouteAllowed(route.url[0].path);
    if (right == "OFF") {
      this.router.navigate([RouteNames.FEATURE_UNAUTHORIZED]);
      return false;
    } else if (right != "ON") {
      this.router.navigate([RouteNames.FEATURE_UNAUTHORIZED]);
      return false;
    }
    return true;
  }


}

UserRightService 的代码是

 isRouteAllowed(route: string): Promise<Right> {

    const securizedPath = new List(this.securizedPaths).FirstOrDefault(
      (e) => e.name == route
    );
    return new Promise((resolve) => {
      return this.getList().subscribe((e) => {
        const right = new List(e).FirstOrDefault(
          (d) => d.code == securizedPath.keyCode
        )?.type;
        if (!right) return resolve("OFF");
        return resolve(right);
      });
    });
  }

securizedPaths定义如下 typescript[{ name: RouteNames.ORDERS, keyCode: "R_ORDERS" }, // other value ]

getList 是

 getList() {
    this.subjectList = new ReplaySubject<T[]>();
    this.load();
    return this.subjectList;
 }

protected load() {
      return this.getService()
        .getAll()
        .then((e) => {
          this.subjectList.next(e);
        })
        .catch((e) => {
          this.subjectList.next([]);
          this.subjectList = null;
        });
  }

// Code for this.getService().getAll()
  async getAll(id?: any, parameter?: any): Promise<Array<T>> {
    let urlParameters;
    ({ urlParameters, parameter } = this.createParameters(parameter, id));
    return this.http
      .get(this.url + (urlParameters ? "?" + urlParameters : ""))
      .toPromise<Array<T>>();
  }

我不确定*是否完全理解您的问题,但根据阅读,我看到了一些我想向您推荐的东西。我在 GuardService

中看到一些问题
@Injectable({
    providedIn: "root",
})

export class GuardService implements CanActivate {
    constructor(
        private router: Router,
        private rightService: UserRightService
    ) { }
    
    canActivate(
        route: import("@angular/router").ActivatedRouteSnapshot,
        state: import("@angular/router").RouterStateSnapshot
    ): Promise<boolean> {
        
        let resolver: (value: boolean | PromiseLike<boolean>) => void;

        const promise = new Promise<boolean>((resolve) => {
            resolver = resolve;
        });
        this.test(route, resolver);
        return resolver;
    }

    async test(route: ActivatedRouteSnapshot, resolver: (value: boolean | PromiseLike<boolean>)) {
        const right = await this.rightService.isRouteAllowed(route.url[0].path);
        if (right == "OFF") {
            this.router.navigate([RouteNames.FEATURE_UNAUTHORIZED]);
            return resolver(false);
        } else if (right != "ON") {
            this.router.navigate([RouteNames.FEATURE_UNAUTHORIZED]);
            return resolver(false);
        }
        return resolver(true);
    }
}

请参阅我以粗体突出显示的代码。

我猜你必须 return 一个承诺,该承诺将根据将收到的响应值在测试方法中解决。

我的提议完全基于一些假设,这些假设帮助我解决了过去 Gurad 的 CanActivte 方法想要异步 return 一个值的问题。