角度-获取当前激活的路线并使用不同的路线参数重新导航到同一页面

Question

在标题的搜索文本框中更改itemCode后，我试图获取当前路线并导航到相同的路线。当我最初进入页面时，父路线为“ iauth / iauthedit / 1706”，然后用户导航至子路线“ / info”，用户可以从侧面导航栏中导航其他几条路线，下图未显示。 如图所示，当我在应用程序标题中将商品代码更改为1853时，URL应该更改为“ iauth / iauthedit / 1853 / info”，如何基于当前的路由URL动态更改浏览器URL路由参数浏览器？，我试图从浏览器URL中找到在当前情况下为父级“ iauth / iauthedit /”的当前激活的路由，以便进行导航

this.router.navigate(['iauth/iauthedit/', 1853];

以下是当前路线：

const itemAuthRoutes: Routes = [
    {
        path: 'iauthedit/:itemCode',
        children: [
            {
                path: '',
                canActivate: [AuthGuard],
                //data: { feature: AppFeature.AuthorizedItem },
                component: ItemAuthorizationEditComponent,
                children: [
                    {
                        path: 'info', component: ItemAuthorizationInfoEditComponent
                    }]
            }]
    }]

Answer 1

Angular提供的ActivatedRoute的问题在于它的值取决于注入它的组件。确实，当您在组件中注入ActivatedRoute时，该值将不是完整路径，而是显示该组件的部分路径。

这意味着，如果您想在包含“项目代码”输入的组件中检索完整的URL，则只能使用Angular API来做到这一点。因此，我建议您使用本机Javascript API解析URL，然后使用this.router.navigate触发导航。

此时，Angular有点聪明，它不会重新加载组件，您可以使用this.activatedRoute.params.subscribe(...)对参数更改做出反应，然后加载新数据并将其传递给子级通过@Input()属性。

Answer 2

您可以尝试遍历routeConfig的{​​{1}}属性

path

希望这会有所帮助：-）

Answer 3

就我而言，我需要路由路径，即/ iauth / iauthedit /：itemCode。  为此，我使用了我在组件中注入的ActivatedRoute和Router。

ActivatedRoute对象具有'pathFromRoot'数组，其最后一个元素在'routerConfig'中包含带有参数值（即iauthedit /：itemCode）的路由器配置路径，然后合并以形成完整的路由器配置路径。

由于您需要没有路由参数的完整路由路径，因此可以使用字符串操作在路由参数之前获取路径，如下所示

URL         https://www.zohoapis.com/crm/v2/users?type=CurrentUser
HEADERS     {Authorization=Zoho-oauthtoken 1000.786ecda99xxxx}

希望这会有所帮助。