Angular路由器导航不会为连续请求更新url参数

问题描述

我正在尝试使用路由器导航更新查询参数

updateURL(queryParams){
        this.router.navigate(['path],{
            relativeto: this.route,queryParams: queryParams,queryParamsHandling: 'merge',skipLocationChange: false
        });
}

/** Wont Work 
updateURL(queryParams);
updateURL(queryParams);
updateURL(queryParams);

/** Will Work
updateURL(queryParams);
// wait
updateURL(queryParams);
// wait
updateURL(queryParams)

对该方法进行顺序调用以更新URL查询参数时，angular不会更新url。 如何处理它，以便即使进行顺序调用也可以进行角度更新

解决方法

从文档中可以保证，您将不得不等待下一次更新

navigate(commands: any[],extras: NavigationExtras = { skipLocationChange: false }): Promise<boolean>

你能试试吗

async updateURL(queryParams){
       await this.router.navigate(['path],{
            relativeTo: this.route,queryParams: queryParams,queryParamsHandling: 'merge',skipLocationChange: false
        });
}

async UpdateQueryParam() {
 await updateURL(queryParams);
  await updateURL(queryParams);
  await updateURL(queryParams)
}