angular 在canMatch接口中包含URL参数,

siv3szwd  于 6个月前  发布在  Angular
关注(0)|答案(8)|浏览(68)

与功能请求相关的@angular/*包?

router

描述

canMatch 路由守卫接受 route: Routesegments: UrlSegment[] 作为参数。这两个对象中都没有可能或不可能在URL中的参数。

示例

将URL路径设置为 users/:userId,当浏览器导航到URL users/user_123 时,我们应该能够访问类似于以下的参数Map:

{
    "userId": "user_123",
}

在我激活 canMatch 守卫的时候,我找不到这个信息。URL段中的参数对象为空,Route对象也没有params对象,使用activate route服务也无法解决问题。我是不是做错了什么?

建议的解决方案

提供一个对象,作为 canMatch 参数或者在 UrlSegmentRoute(我不关心它们在哪里,只要对Angular路由设计有意义就行)中包含URL参数。

考虑过的替代方案

我们目前可以获取路由中的路径和URL片段,将它们进行比较,并从中推导出参数。
但我觉得不应该这样做吧?canActivate方法可以通过激活的路由快照(params对象)访问这些数据,而我不知道为什么我们不能在 canMatch 中实现类似的功能呢?

x9ybnkn6

x9ybnkn61#

canActivate方法可以通过激活的路由快照(params对象)访问这些数据,我不明白为什么在canMatch中我们不能有类似的功能?
这是因为canActivate发生在匹配之后。我们在匹配完成后才获得参数信息,因为路由配置会影响参数是什么。
可能我们可以调查积累一组当前匹配的参数,直到达到Route配置并运行canMatch
请注意,缺乏这些信息实际上是阻碍这个功能请求的原因,因为体验将是不最优的:#13373

c90pui9n

c90pui9n2#

在匹配完成后,我们才拥有参数信息,因为路由配置会影响参数。

感谢你的回复!我想弄清楚在执行 canMatch 时,路由配置中哪些部分可以影响参数?我希望能够更好地理解这个问题。

对于我的用例,我确实需要一个非常简单的东西来覆盖大多数情况:

  1. 路由路径是 something/:something_id -> 我们目前有这个
  2. 当我们导航到与上述路径匹配的 URL 时,Url Segments 是 ['something', '123456'] -> 我们目前有这些
  3. 参数是 {'something': '123456'} -> 这是我需要执行 canMatch 所需的
    除非我漏掉了什么,否则我可能可以编写一个自定义守卫来完成我需要的解析。我只是惊讶于它还没有出现,而且我不知道整体架构中会阻止这种情况发生。再次,我对 Angular 在幕后所做的了解不多。
a9wyjsp7

a9wyjsp73#

我应该补充一下,也许在我的用例中,canActivate 是一个更好的解决方案,但它没有自动尝试失败时的不同模式的好处。能够在没有匹配的路由的情况下设置一个通配符路由和一个通用的“资源未找到”组件是一个很棒的功能,但我觉得我们真的不能用 canMatch 的当前接口替换 canActivate

vlurs2pr

vlurs2pr4#

路由路径是 something/:something_id -> 我们目前有这个
我们绝对可以轻松地访问正在匹配的当前路由的参数。然而,这些不是最终的,因为重定向可能会导致参数和参数名称发生变化。您可以通过在您的守卫中重新运行匹配器来手动获取这些信息:

canMatch: [
          (route: Route, segments: UrlSegment[]) => {
            const matcher= route.matcher || defaultUrlMatcher;
            const matchResult = matcher(
              segments,
              new UrlSegmentGroup(segments, {}),
              route
            );
            console.log(matchResult);
            return true;
          },
        ],

https://stackblitz.com/edit/angular-6m5gvr?file=src%2Fmain.ts
这些只是当前路由,如我之前提到的,我们目前不会从父配置中传递参数匹配(无论什么情况,您都绝对不会访问任何子参数)。此外,由于我们尚未匹配所有父级的子级,因此在完成此操作之前,我们无法构造父树对象( UrlSegmentGroupActivatedRoute )。
参数是 {'something': '123456'} -> 这是我要执行的 canMatch
...
guard接受route: Route和segments: UrlSegment[]作为参数。这两个对象都不包含URL中可能存在的参数。
我认为部分困惑在于 parametersUrlSegment 上并不是路由配置中的路径参数名称。这些将是类似于URL中的矩阵参数 /a;something_id=1234
长话短说,我认为这是一个我们应该解决的问题,特别是如果我们想要实现 #13373 (我们确实要实现)。我想大多数人之前都没有考虑过这个问题。

hfyxw5xn

hfyxw5xn5#

这个功能请求现在已经成为我们的待办事项候选!在接下来的阶段,社区有60天的时间进行投票。如果请求获得超过20票的赞成,我们将把它移到我们的考虑列表中。
你可以在我们的文档中找到更多关于功能请求流程的详细信息。

o4hqfura

o4hqfura6#

感谢@atscott,你的回复和示例代码非常有帮助!
最终我成功地完成了canMatch保护的工作,但我认为在执行保护时,可以向开发者提供更多信息。

olhwl3o2

olhwl3o27#

请注意,我们已经开始了针对您的功能请求的社区投票过程。距离投票过程结束还有20天。
有关Angular功能请求流程的更多详细信息,请参阅我们的文档。

j1dl9f46

j1dl9f468#

感谢您提交您的功能请求!看起来在投票过程中,它没有收集到足够的票数进入下一阶段。
我们希望保持Angular丰富且符合人体工程学,同时关注其范围和学习过程。如果您认为您的请求可能超出了Angular的范围,我们鼓励您与community合作,将其发布为开源项目package
您可以在我们的文档中找到有关功能请求过程的更多详细信息。

相关问题