0

我有一种情况，我想通过 api 从数据库中获取一些 url，然后在我的页面上有这些（外部）链接。

所以我想做这样的事情：

组件.ts

public url: string;

ngOnInit(): void {
  this.url = getFromAPI()
}

组件.html

<a href="{{url}}"> here's a link </a>

但对于我的生活，我不知道该怎么做。我在这里尝试使用属性指令方法： https ://stackblitz.com/edit/angular-external-links?file=src%2Fapp%2Fexternal-url.directive.ts

但我一定做错了，因为它对我不起作用；我的链接仍然显示为 https://localhost:4200/urlFromAPI

我也尝试过这里描述的方法： https ://kevinphelps.me/blog/2017-06-30-handling-external-links-in-angular

但后来我的链接根本不起作用。点击它们什么都不做。

有没有一种我想念的简单方法来做到这一点？或者这在 Angular 中真的很难吗？

4

2 回答 2

0

好的。如果链接以“http[s]://”开头，则 Angular 不会假定它是内部链接。就这样。

于 2020-11-06T22:50:46.443 回答
0

在您的 stackblitz 应用程序中，您设置的默认值与false您一样deactivateGuard。就这样，那边的导航被挡住了。

在这里，我需要用户确认是否使用window.confirm('Are you sure?').

在您的 routing.module.ts 文件中：

{
   provide: deactivateGuard,
   useValue: () => {
     console.log('Guard function is called!')         
     return window.confirm("Are you sure?");
   }
}

参考：https ://stackblitz.com/edit/angular-external-links-aph8hk?file=src%2Fapp%2Frouting.module.ts

让我知道它是否有效。

于 2020-11-05T02:01:28.250 回答