Question

这可能是一个愚蠢的问题，但我是Angular的新手并没有得到答案。

我正在学习一个教程，并为我的Angular 5项目设置了这样的路线：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';

import { PageComponent } from './page/page.component';

const appRoutes: Routes = [
  {path: '', redirectTo: '/home', pathMatch: 'full'},
  {path: 'home', component: PageComponent, data: {
    page: 'home'
  }},
  {path: 'about', component: PageComponent, data: {
    page: 'about'
  }},
  {path: 'contact', component: PageComponent, data: {
    page: 'contact'
  }},
  {path: 'facebook', component: PageComponent, data: {
    page: 'facebook'
  }},
  {path: '**', redirectTo: '/home', pathMatch: 'full'}
];

@NgModule({
  imports: [RouterModule.forRoot(appRoutes)],
  exports: [RouterModule]
})
export class AppRoutingModule {
}

让我们说我想要路由＆＃34; facebook＆＃34;我的Facebook页面的路径。我不知道如何路由到Angular Application之外的页面。

任何帮助将不胜感激！

Answer 1

@Rafael作为评论留下了正确答案。

您只需创建一个指向facebook的链接标记

<a href="www.facebook.com/yourpage">Facebook</a>

您正在设置的路由全部用于本地路径。换句话说，所有这些路线都是www.yoursite.com/route1上显示的内容，以及www.yoursite.com/route2上显示的内容。

但请注意，他们都将拥有域名的yoursite.com。

如果您想创建指向域外部网站的链接，那么您不希望混淆角度路由，而是创建链接。

所以您真正要问的是如何在www.yourpage.com/facebook上显示www.facebook.com的页面，这是不可能的。

如果没有iframe，您无法在自己的网站中显示不同的网站，即使是路线也是如此。

如果这确实是您尝试做的事情，那么您可能需要查看iframe。

Answer 2

只需使用常规锚点href。

<a href="http://facebook.com">Add Vehicle</a>

或javascript：

window.location.href = 'http://facebook.com';

Answer 3

对于正在寻找如何实施的解决方案的任何人上面提到的使用 TypeScript 的解决方案是下面的一个例子

const link = document.createElement('a');
link.href = 'http://facebook.com/'
link.target = '_blank';
link.click()

如果您想了解如何从外部链接下载，只需添加

link.download = 'download';

如何在Angular 5中路由到外部链接

3 个答案: