Tenemos algunos archivos de plantilla con sus componentes. También tienen sus rutas definidas y llamadas como:
<a routerLink="/Path-with-component"> Open page with component </a> También tenemos archivos .html simples y estáticos que estrictamente no necesitan ninguna lógica como tal. Entonces, los estamos llamando como:
<a href="Static-page.html">Open static page</a>Siempre pasan por el enrutador y el archivo no se llama desde la ruta física.
Entonces, necesitamos que no pasen por el enrutador Angular 2. Cómo hacemos esto?
Idealmente, no debería pasar por el enrutador, a menos que haya definido una ruta de carácter salvaje.
{ path: '**', component: <some component>} @Component({ selector: 'my-app', template: `<h1>Hello {{name}}</h1> <hr /> <a routerLink="/home" >Home</a> <a href='test.html' >Static page</a> <hr /> <router-outlet></router-outlet> ` }) class AppComponent { name = 'Angular'; } @Component({ template: `<h1>Home</h1> ` }) class HomeComponent { } const appRoutes: Routes = [ { path: '', redirectTo: '/home', pathMatch: 'full' }, { path: 'home', component: HomeComponent } ]; @NgModule({ imports: [ BrowserModule, RouterModule.forRoot(appRoutes) ], declarations: [ AppComponent, HomeComponent ], bootstrap: [ AppComponent ] }) export class AppModule { }Mira este Plunker
¡¡Espero que esto ayude!!