【问题标题】:Angular 8 route resolver not canceling route navigation when return EMPTYAngular 8 路由解析器在返回 EMPTY 时不会取消路由导航
【发布时间】:2019-07-17 15:20:32
【问题描述】:

我正在添加一个 Angular 8 路由解析器来预取数据。失败后(出于任何原因),我返回 EMPTY 以取消路线导航。但是,当我对此进行测试时,我可以进入 catchError 块,它显示烤面包机,并返回 EMPTY,但不会取消路线导航。根据我读过的所有文章,这应该有效。想知道是否有人看到我没有看到的东西。我只包含了 resolve 方法,因为所有其他配置都在工作。


  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Country[]> | Observable<never> {
    return this.countryService.getCountries().pipe(      
      mergeMap((countries) => {
        if (countries)
        {
          return of(countries);
        }
        return EMPTY;
      }),
      catchError(error => {
        this.toasterService.pop('error', '', 'There was a problem prefetching the data required to submit a request. If the problem persists, please notify the administrator.');
        return EMPTY;
      }));
  }

根据角度文档,我希望此代码取消导航。

【问题讨论】:

    标签: angular angular-resolver


    【解决方案1】:

    更新:我回到源代码 angular.io 并查看了 Angular 团队如何实现解析器。他们有一段所有其他博客文章都没有的代码:

     resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Country[]> | Observable<never> {
        return this.countryService.getCountries().pipe(      
          mergeMap((countries) => {
            if (countries)
            {
              return of(countries);
            }
            this.router.navigate(['/']);//<----- THIS LINE, TO RE-DIRECT TO ANOTHER ROUTE
            return EMPTY;
          }),
          catchError(error => {
            this.toasterService.pop('error', '', 'There was a problem prefetching the data required to submit a request. If the problem persists, please notify the administrator.');
            this.router.navigate(['/']);//<----- THIS LINE, TO RE-DIRECT TO ANOTHER ROUTE
            return EMPTY;
          }));
      }
    

    所以添加路由器重定向对我来说似乎是一个额外的步骤。特别是因为 EMPTY 会取消导航是直接矛盾的。我错过了什么?

    【讨论】:

    • 我有同样的问题,但我注意到 return EMPTY 适用于子路由,而不是父路由。我需要在父路由解析器中显式重定向,但对于孩子来说,一切正常。有谁知道发生了什么?
    • 你指的是link这样的场景吗?
    • 是的,我发现这是一个存在的问题github.com/angular/angular/issues/24195
    • 没有超载匹配这个调用,有人遇到过这个问题吗?
    • 你能给我更多的信息.​​.也许是代码行?
    猜你喜欢
    • 1970-01-01
    • 2017-12-11
    • 1970-01-01
    • 1970-01-01
    • 2018-04-30
    • 2017-05-03
    • 1970-01-01
    • 2020-02-19
    • 1970-01-01
    相关资源
    最近更新 更多