如何在 routerLink 指令中使用完整的 URL 字符串（带有查询参数）？

Question

考虑这个从内部 CMS 返回的对象

export declare interface ContentItem {
    id: string;
    title: string;
    subTitle: string;
    clickUrl: string;
    imageUrl: string;
    contentType: string;
    ...
}

将clickUrl有一个完整的 url，可导航到有效的角度路线。我正在寻找一种在routerLink指令中使用此 url 的方法；像这样的东西

<a [routerLink]="contentItem.clickUrl">click me</a>

我的问题是当这个网址包含查询参数时。该指令将从 url 中转义“?”、“=”和“&”字符。

我知道我们可以像这样传递查询参数：

[queryParams]="{ articleId: contentItem.id }"

clickUrl但是，如果不从前面提到的查询参数部分中删除，这将不起作用。

Answer 1

routerLink您可以使用控制器来代替使用。

<a (click)="goTo(contentItem.clickUrl)">click me</a>

在控制器中：

this.goTo(url) {
  this.router.navigateByUrl(url);
}