This might be a dumb question but I am new to Angular and haven't gotten an answer for this.
I was following a tutorial and have my routes set up like this for my Angular 5 project:
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 {
}
Let's say I want to route the "facebook" path to my facebook page. I am not sure how to route to pages outside of the Angular Application.
Any help would be appreciated!
@Rafael Has left the correct answer as a comment.
You would just create a link tag pointing to facebook
<a href="www.facebook.com/yourpage">Facebook</a>
The routes that you are setting up are all for local paths. In other words, all of those routes are for what is displayed on www.yoursite.com/route1, and what is displayed on www.yoursite.com/route2.
But notice that they will all have yoursite.com for the domain.
If you want to create a link to a site outside of your domain, then you do not want to mess with the angular routing, but instead create a link.
So what you're really asking is how can you show www.facebook.com's page on www.yourpage.com/facebook, which is not really possible.
Without an iframe you cannot display a different website within your own site, even with a route.
If that is really what you're trying to do, then you might want to look into iframes.