如何将绝对链接视为Angular中的相对路线？

Question

我有一个收件箱组件，用于显示在后端以HTML格式生成的用户消息。 通过设置查看器组件的[innerHTML]呈现消息。

这些消息可以包含具有指向应用程序其他页面的绝对URL的链接（格式为<a href="..."> ）。 当前，当您单击链接之一时，Angular会重新加载页面，就像您单击指向外部网站的链接一样。

我如何让Angular直接导航到应用程序中的目标组件，而不是重新加载页面？

附加信息

我想到的一个想法是检查html中的绝对链接，尝试将它们与当前主机匹配，如果匹配，则删除绝对部分以使其相对。 但是，这没有用，并且Angular在导航到链接时仍会重新加载页面。 我认为这是因为考虑到消息只是普通HTML，所以没有routerLink指令。 可能的解决方法是拦截链接的打开并将其传递给路由器，而不是将其视为相对链接吗？

这些链接必须是绝对的，不能只是相对于开头，是因为我们有多个门户应用程序，用户可以通过同一个帐户共享同一个消息中心来访问该门户应用程序。 有些消息可能链接到门户网站A中的项目，而另一些消息则可能链接到门户网站B中的项目。这似乎有些令人费解，但是我们这样做的理由非常充分，我不能在这个问题中进行解释。

Answer 1

弄清楚了！

首先拦截邮件内容中链接的click事件：

<div [innerHTML]="message.Content"
     (click)="onContentClick($event)"
     class="content"></div>

如果链接的主机与当前主机匹配，则使用路由器处理该链接：

onContentClick(e: MouseEvent) {
  if (e.target instanceof HTMLAnchorElement
      && e.target.host === location.host) {
    e.preventDefault();
    this.router.navigateByUrl(e.target.pathname);
  }
}