如何在 Angular 2 中绕过路由器

Question

我们有一些模板文件及其组件。他们还定义并调用了自己的路线：

<a routerLink="/Path-with-component"> Open page with component </a>

我们也有 普通和静态 .html 文件，这些文件严格不需要任何逻辑。所以，我们这样称呼它们：

<a href="Static-page.html">Open static page</a>

他们总是通过路由器并且文件不是从物理路径调用的。

因此，我们需要它们不通过 Angular 2 路由器。我们如何做到这一点？

Answer 1

理想情况下它不应该通过路由器，除非你定义了一个 wild char 路由。

{ 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 { }

勾选这个Plunker

希望对您有所帮助！！

如何在 Angular 2 中绕过路由器

How to bypass router in Angular 2

html

javascript

angular2-template

angular2-routing

angular