javascript - Angular : pass optional data within route

Question

我正在使用 angular 5 ，我有一个很长的路由文件:

const homeRoutes: Routes = [
  {
    path: 'home', component: HomeComponent,
    children: [
      {
        path: 'registration',
        component: RegistrationComponent,
        children: [
          {
            path: 'synthese',
            component: SyntheseComponent
          },
          {
            path: 'queue',
            component: QueueComponent,
            children: [
              {
                path: 'queue-modal',
                component: QueueModalComponent
              },
              {
                path: 'confirm',
                component: ConfirmComponent
              }
            ]
          }
        ]
      },
      {
...

我想在“注册”路径中传递数据。

有人告诉我，我需要这样写:path: 'registration/:mydata',

然后订阅ActivatedRoute

的数据

我并不总是传递数据的问题，它只是在某些情况下。

我怎样才能做到影响最小？？

Answer 1

您可以使用查询字符串参数(也称为 queryParams)代替路由参数。您不需要在路由中定义查询参数。

这里是一个相对 href 的例子:

registration/?mydata=123

这是为 routerLink 定义 queryParams 的方法:

<a [routerLink]="['registration']" [queryParams]="{ mydata: 123 }">Go to Registration</a>

这是您读取该参数值的方式:

myValue: any;

constructor(private route: ActivatedRoute) {}

ngOnInit() {
  this.route.queryParams.subscribe(params => {
    this.myValue = params['mydata'];
  });
}