Question

params在targetComponent中订阅：

import Router from @angular/Router

  export class TargetComponent {
     constructor(private activeRoute: ActivatedRoute) {
       this.activeRoute.params.subscribe(params => {

       console.log(params)   // receives targetName but with different attributes
       console.log(params.name);   // sometimes params has attribute name 
       console.log(params.target); // and sometimes target 

  });

  }
}

从firstComponent发送params

import ActivatedRoute from @angular/Router

this.router.navigate(['/', 'search' , targetName]);

从第二个组件发送参数

this.router.navigate(['/', 'table', targetName]);

路线配置

const routes: Routes = [
  {
    path: '',
    redirectTo: 'welcome',
    pathMatch: 'full'
  },
  {
    path: 'search/:name',
    component: SearchItemComponent
  },
  {
    path: 'table/:target',
    component: TableDataComponent
  }
 ]

试图理解为什么params对象会有＆＃39;目标＆＃39;属性，有时名称＆＃39;从不同的组件导航时存储值。

Answer 1

我假设您正在使用Angular的RouterModule中的某些内容？

我能想到的一件事是，那里的一些代码是重复的，有些路线有一种迂回的方式到达目的地。

例如，您可能会看到代码如下所示：

:checked

'：'后面的值是激活路线'参数'名称的决定因素（在这种情况下是'name'或'target'）。因此，如果您尝试访问目标/名称，但const routes: Routes = [ { path: 'target/:name', component: TargetComponent, canActivate: [AuthGuard]}, { path: 'target/:target', component: TargetComponent} ]返回false，则会转到目标/目标。事实上，没有任何改变，但参数的名称显然会有所不同，但价值不会（具体来说，您可以访问canActivate，但不能访问params.target）。< / p>

其他提示

需要注意的一点是，路由器确实从上到下。因此，在类似情况下，如果您将数组切换为如下所示：

params.name

ActivatedRoutes'参数'名称将始终为'target'，因为没有canActivate-Guard可以阻止路由器访问该路由

订阅activatedRoute，params具有不同的属性来保存传递的param值

1 个答案: