Angular 2 新路由器 - 路由未显示在 <router-outlet></router-outlet>

问题描述 投票:0回答:1

Angular 2 还很新,在新 Router 上还没有完全跟上速度。我遵循了 Angular 文档中的示例,虽然我没有收到错误,但我的组件没有显示在标签中。

这是路由器代码:

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

import {HomeComponent} from './home.component';
import {FeaturesComponent} from './features.component';

const appRoutes: Routes = [
  { path: '', component: HomeComponent },,
  { path: 'features', component: FeaturesComponent },
  { path: '**', component: HomeComponent }
];

export const appRoutingProviders: any[] = [

];

export const routing = RouterModule.forRoot(appRoutes);

添加这里的app.module.ts代码:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent }  from './app.component';
import { routing,
         appRoutingProviders } from './app.routing';

import {HomeComponent} from './home.component';
import {FeaturesComponent} from './features.component';

@NgModule({
  imports: [ BrowserModule, routing ],
  declarations: [ AppComponent, HomeComponent, FeaturesComponent ],
  providers: [appRoutingProviders],
  bootstrap: [ AppComponent ]
},
)
export class AppModule { }

我在 app.component.html 中有 routeroutlet 标签

<div class="container">
  <router-outlet></router-outlet>
</div>

这里有什么我想念的吗?我的印象是我的 home.component.ts 应该在加载页面时显示在路由器出口标签中,但它没有这样做。任何指导将不胜感激。谢谢。

angular routes router
1个回答
0
投票

我按照这些新指南重做 routing.ts 和 module.ts 解决了这个问题https://angular.io/docs/ts/latest/guide/router.html。我不确定问题到底是什么,可能是 appRoutes 常量中的双逗号。

© www.soinside.com 2019 - 2024. All rights reserved.