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

Ori*_*ion 1 angular angular5

这可能是一个愚蠢的问题,但是我对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 {
}
Run Code Online (Sandbox Code Playgroud)

假设我要将“ facebook”路径路由到我的Facebook页面。我不确定如何路由到Angular Application之外的页面。

任何帮助,将不胜感激!

Mat*_*att 7

只需使用常规锚点 href。

<a href="http://facebook.com">Add Vehicle</a>
Run Code Online (Sandbox Code Playgroud)

或对于 javascript:

window.location.href = 'http://facebook.com';
Run Code Online (Sandbox Code Playgroud)


JBo*_*hUA 5

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

您只需创建一个指向Facebook的链接标签

<a href="www.facebook.com/yourpage">Facebook</a>
Run Code Online (Sandbox Code Playgroud)

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

但是请注意,他们都将拥有该域的yoursite.com。

如果要创建指向您域外站点的链接,则不想弄乱角度路由,而要创建一个链接。

因此,您真正要问的是如何显示www.yourpage.com/facebook上的www.facebook.com页面,这实际上是不可能的。

没有iframe,即使有路线,也无法在自己的网站上显示其他网站。

如果这确实是您要尝试执行的操作,那么您可能需要研究iframe。