javascript - 在 Angular 4 中使用数组参数进行路由

Question

我目前正在尝试解决 Angular 4 中的路由问题。我希望 URL 包含参数数组，所以它看起来像这样:/#/WF001A;operationIds=146469,146470 .这个 URL 是由 Angular 使用 [routerLink] 生成的。参数需要可以从组件访问(我想这应该不是问题)。

问题是 - 我不知道如何为它创建路线。我尝试了什么:

• {path: 'WF001A/:operationIds', component: WF001AComponent}
• {path: 'WF001A/:operationIds[]', component: WF001AComponent}
• {path: 'WF001A:operationIds[]', component: WF001AComponent}
• {path: 'WF001A;:operationIds[]', component: WF001AComponent}

编辑:链接是这样生成的:

<a href="#" [routerLink]="['/WF001A', {operationIds:[146469, 146470]}]">test</a>

编辑 2:组件类:

export class WF001AComponent implements OnInit {
    public title = 'WF001A';

    public constructor (private WF001AService: WF001AService, private route: ActivatedRoute) {}

    public ngOnInit(): void {
        this.route.paramMap.subscribe(params => {
            // This is never executed, for route is not recognized
            let myArray=params.getAll('operationIds');
            console.log(myArray);
        });
    }
}

Answer 1

我假设您的组件中有 ActivatedRoute 对象，例如:

constructor(
    ...,
    private route: ActivatedRoute) { }

我假设 WF001A 是参数名称， 因此您可以执行以下操作:

this.route.paramMap.subscribe(params => {
  let i=0;
  let myArray=params.getAll('operationIds');
}

您可以在 official documentation 中找到有关可选参数的更多信息