Angular 11路由URL如何传递多个参数？跳转报404错误如何解决

• 变量执行顺序颠倒：你先执行了路由跳转逻辑，之后才从当前路由获取projectmodelname参数赋值给this.salesPackName，跳转时该变量为undefined，导致生成的URL参数位为空，和你配置的路由规则不匹配。
• 路由分段写法错误：Router.navigate方法接收的路径数组中，除了首个根路径分段可以带前导斜杠/，后续分段不需要添加前导斜杠，你写的'/salespack'多了前导斜杠，会导致路由解析逻辑异常。

// 先赋值参数，再执行跳转
this.salesPackName = this.route.snapshot.paramMap.get('projectmodelname');
// 移除salespack前的前导斜杠
this.router.navigate(['/projectmodel', this.salesPackName, 'salespack']);

可以增加参数非空校验，避免参数为空时跳转到无效路由：

this.salesPackName = this.route.snapshot.paramMap.get('projectmodelname');
if (this.salesPackName) {
  this.router.navigate(['/projectmodel', this.salesPackName, 'salespack']);
} else {
  // 可在这里添加参数为空时的兜底逻辑，比如跳转到列表页
}

内容的提问来源于stack exchange，提问作者Developer18