Question

我有类似

的网址

www.yoursite.com/accounts/:accountid/info
www.yoursite.com/accounts/:accountid/users等

URL中提供了整数值accountid

但是无法使用ActivatedRoute参数访问它。

现在，我将拆分URL以获取accountid

除了分割URL之外，还有其他更好的方法来访问值吗？

更新

我有一个名为account的模块，其中包含帐户相关页面的所有组件和服务。

我懒于加载此模块。因此，在根级路由中，我指定的是app-routing

{ path:'account', loadChildren : './account/account.module#AccountModule' }

在帐户模块的account-routing中，我指定子级依据

path: 'account/:accountid', component: AccountComponent, canActivate: [AuthGuard],
    children: [
      { path: '', redirectTo: 'info', pathMatch: 'full' },
      { path: 'info', component: InfoComponent },
      { path: 'users, component: UsersComponent }
      {path: '**', redirectTo: 'info'}
    ]

注意：

如果存在，我们可以访问子路径中的参数。但是为什么不是父本？

我在父路径中获得undefined的参数

Answer 1

尝试一下

在构造函数中创建ActivatedRoute的对象

constructor(private route: ActivatedRoute) {}

因此，一旦对象创建完毕，您将获得如下路径参数

    let accountid = this.route.snapshot.params['accountid'];

    console.log(accountid);

OR

let accountid = this.activatedRoute.snapshot.paramMap.get('accountid');
console.log(accountid);

我希望这会有用。

Answer 2

借助此 article ，问题得以解决。

要访问父路由中的params，我们需要使用activeRoute.parent.params 而不是activeRoute.params

this.activatedRoute.parent.params.subscribe(
    (params) => 
    { 
                 console.log(params.accountid); 
     });

还从this stackoverflow question 开始，找到了一种使所有参数（包括父路径参数）可用于子路径的解决方案。

这是通过在其中导入paramsInheritanceStrategy的{{1}}设置为always的配置对象中完成的。

例如：

RouterModule

现在我们可以使用import {RouterModule, ExtraOptions} from "@angular/router"; export const routingConfiguration: ExtraOptions = { paramsInheritanceStrategy: 'always' }; export const Routing = RouterModule.forRoot(routes, routingConfiguration);

访问父级和子级路由参数

Answer 3

尝试以下解决方案：

 this.activatedRoute.params.subscribe(params => {
        const accountid= params['accountid'];
    });

如果以上方法无效，您也可以尝试此操作。（Got this solution from here）

this.router.parent.params.switchMap(params => {
  // params = { id: 1234 }
});

Answer 4

我认为您需要通过构造函数中的以下代码访问当前的路由参数，

this.activeRoute.params.subscribe(params => {
     if(params['accountid']) {
         console.log(params['accountid'])  // use it where you need
     }
})

Answer 5

您只需要使用 paramsInheritanceStrategy。见https://angular.io/api/router/ExtraOptions

Answer 6

parent属性现已添加到路由：

 this.route.parent.paramMap
                .subscribe(params => {
                    if (params.has('accountid')) {
                        this.'accountid'= params.get('accountid');
                    }
                });

Angular：获取父路径中参数的值

6 个答案: