Angular 6：在子路由中跳过父路由解析器？答案

【问题标题】：Angular 6: Skip parent route resolver in child route?Angular 6：在子路由中跳过父路由解析器？
【发布时间】：2018-09-17 07:05:42
【问题描述】：

我正在尝试向我的应用程序添加路由，并且我有一个带有 parentResolver 的父路由和一个带有 Child Resolver 的子路由。当我访问“/parent”时，父解析器完美启动。

但问题是，当我访问“/parent/child”时，父解析器会在子解析器启动之前再次启动。我不想在导航到孩子时运行父解析器页。

那么有没有办法在调用子路由时跳过父解析器。这是我的路线配置

{
    path: 'parent',
    component: ParentComponent,
    resolve: {parentData: ParentResolver},
    runGuardsAndResolvers: 'paramsOrQueryParamsChange',
    children: [
      {
        path: 'child',
        component: ChildComponent,
        resolve: {childData: ChildResolver},
        runGuardsAndResolvers: 'paramsOrQueryParamsChange'
      }
    ]
  }

【问题讨论】：

您也可以在不使用解析器的情况下定义路由。
我正在使用解析器。对于父路由和子路由。因此，如果 url 是 /parent?someparam=somevalue，则父解析器使用查询参数。子解析器也应该发生同样的情况。
这就是我告诉你的，不用它也能做到。我可以共享路由代码，您可以在不使用它们的情况下定义路由
@Exterminator 我知道它可以在没有的情况下完成。但我需要解析器。
你的ParentComponent 不是真正的父母，如果孩子在场时行为发生变化的话。因此，也许您可以将其拆分为一般需要的内容（没有解析器的父路由）和仅在没有子节点存在时才需要的内容（带有父解析器的新路由）。

标签： angular

【解决方案1】：

在父解析器中检查目标路径是什么。（或者如果 ActivatedRouteSnapshot 有孩子）

resolve(route: ActivatedRouteSnapshot) {

  if (route.children.length) {
    // target is some child
  } else {
    // target is parent
  }

}

创建独立路径：'父/子'

【讨论】：

我尝试了第一种方法，但问题是子组件会覆盖路由器插座中的父组件。我想让孩子显示在父母的路由器插座中
paren 有自己的router-outlet 吗？我认为没有人理解您的问题，您能否提供在线示例？（堆栈闪电战）
是的，在这种情况下，父级是应用根目录的子级。它有自己的路由器插座。子组件应显示在父组件的路由器出口中。我会尝试做一个 plunkr。

【解决方案2】：

尝试以下方法：

{
    path: 'parent',
    children: [
               {  path : '',
                  pathMatch : 'full',
                  component: ParentComponent,
                  resolve: {parentData: ParentResolver},
                  runGuardsAndResolvers: 'paramsOrQueryParamsChange',
               },
               {  path: 'child',
                  component: ChildComponent,
                  resolve: {childData: ChildResolver},
                  runGuardsAndResolvers: 'paramsOrQueryParamsChange'
               }
             ]
}

【讨论】：

试过这个。但是随后子组件会覆盖路由器出口中的父组件。
检查更新的答案。我为父路径添加了pathMatch : 'full'

【解决方案3】：

你可以创建一个我称之为 ResolverGuard 的东西，它是一个充当 Resolver 的 Guard。

{
path: 'parent',
component: ParentComponent,
resolve: [ParentResolver], // simply return an Observable<boolean>
runGuardsAndResolvers: 'paramsOrQueryParamsChange',
children: [
  {
    path: 'child',
    component: ChildComponent,
    canActivate: [ChildResolverGuard],
    runGuardsAndResolvers: 'paramsOrQueryParamsChange'
  }
]

}

但是，这只会在父解析器之前运行子守卫。解析器无论如何都会运行，但您可以在 ParentResolver 中添加逻辑以在子 Guard 运行时跳过它。

结帐https://github.com/angular/angular/issues/20805#issuecomment-350106463

【讨论】：