Angular router.navigate use array as list of queryParams

霸气de小男生 提交于 2020-08-09 06:56:51

问题


Im navigating after building up a queryParams object with a form:

options {
    ...
    words: (4) ["chuck", "norris", "vs", "keanu", "reeves"]
}

Then navigate with that object to update the URL's parameters:

this.router.navigate(['/search'], { queryParams: options });

The URL words param is duplicated for each entry like this:

/search?words=chuck&words=norris&words=vs&words=keanu&words=reeves

How do we pass in an array to queryParams properly?

Links: angular.io/api/router/Router#navigate alligator.io/angular/query-parameters

queryParamsHandling has no affect on this. Here is a StackBlitz repro.


回答1:


You're doing it the correct way, just use params.getAll in your /search component:

words: string[];

constructor(private route: ActivatedRoute) {
}

ngOnInit() {
  this.route.queryParamMap.subscribe(params => this.words = params.getAll('words'));
}


Update: working example on stackblitz: angular-query-params-pass-array



来源:https://stackoverflow.com/questions/57063455/angular-router-navigate-use-array-as-list-of-queryparams

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!