Angular 使用链接转到外部页面答案

【问题标题】：Angular go to outside page using linkAngular 使用链接转到外部页面
【发布时间】：2020-09-09 04:52:46
【问题描述】：

使用链接在项目外打开另一个页面

<div class="info-line">
   <mat-icon class="s-20 ml-2">
    language
   </mat-icon>
   <a class="h3" href="https://www.google.kz/">
     Web Page
   </a>
</div>

但是当点击链接时，打开了这个页面：http://localhost:4200/google.kz - 本地页面，而不是“google.kz”

如何制作，打开google.kz外站链接，而不是试图在本地页面中查找？

【问题讨论】：

您拥有的标记应该可以正常工作。您所描述的是，如果您改为使用 <a class="h3" href="google.kz"> 或 <a class="h3" href="/google.kz">，通常会发生什么
你确定你放了https 前缀吗？

标签： html angular hyperlink href

【解决方案1】：

您可以使用target="blank"，如下所示。

<a class="h3" href="https://www.google.kz/" target="_blank">

target

在何处显示链接的 URL，作为浏览上下文的名称（选项卡、窗口或 iframe）。

_blank：通常是一个新标签页，但用户可以配置浏览器以打开一个新窗口。

【讨论】：

【解决方案2】：

它应该按照您描述的方式工作，但另一种方式是使用 document.location api。

例子：

<div class="info-line">
   <mat-icon class="s-20 ml-2">
    language
   </mat-icon>
   <a class="h3" (click)="navigate()">
     Web Page
   </a>
</div>

在你的组件内部：

navigate(){
     document.location = "https://www.google.kz/"
}

【讨论】：

document.location 出现异常 - 类型“google.kz”不可分配给类型“位置”。