URL修改:角

Question

我有一个函数，我用来循环一些图片，这改变了我的URL。我使用角路由获取我的第一个URL，“域”参数是一个由domain.id和domain.category <a [routerLink] = "['/image', image.id, domain]">组成的数组。

当我选择第一个图像时，我得到了我的URL的正确结构。http://localhost:4200/image/1;id=1;category=testing.

然而，当我调用我的“下一步”函数循环通过图像时，我得到了这个URL。"http://localhost:4200/image/2?id=1&category=testing.

基本上，我想问的是，是否有可能替换"?“和"&“并将它们转化为";”

​

next() {
  const next = this.activeId + 1 >= 9 ? 1 : this.activeId + 1;
  const extras: NavigationExtras = {
    queryParams: {
      id: this.domain.id,
      category: this.domain.catergory
    }
  };
  this.router.navigate(['/image/' + next], extras);
}

​

Answer 1

使用字符串插值，尝试如下

使用navigateByUrl

next() {
    const next = this.activeId + 1 >= 9  ? 1 : this.activeId + 1;
   this.router.navigateByUrl('/image/' + `${next};id=${this.domain.id};category=${this.domain.catergory}`);
}

Answer 2

如果您喜欢使用queryParams (我建议使用)，您可以更改使用routerLink构建的第一个示例。例如，如果您：

Change

<a [routerLink] = "['/image', image.id, domain]">

到

<a [routerLink] = "['/image']" [queryParams]="{imageId: image.id, domain: domain.id, category:domain.category}">

然后你的第一个网址将包含"http://localhost:4200/image/1?id=1“

在整个应用程序中，这种行为将更加一致。