我的目录:
--root
--src
--app
--app.module.ts
--app.component.ts
--app.routing.module.ts
--brand
--category
--home
--recommend
--recommend-detail
--node_modules
我的服务器配置:
{
"server" : {
"baseDir" : "src",
"routes" : {
"/node_modules" : "node_modules"
}
}
app.routing.module.ts:
import { NgModule } from '@angular/core' ;
import { APP_BASE_HREF } from '@angular/common' ;
import { RouterModule, Routes} from '@angular/router' ;
import { HomeComponent } from './home/home.component' ;
import { CategoryComponent } from './category/category.component' ;
import { BrandComponent } from './brand/brand.component' ;
import { RecommendComponent } from './recommend/recommend.component' ;
import { RecommendDetailComponent }from './recommend-detail/recommend-detail.component' ;
const routes : Routes = [
{ path : '', redirectTo : 'recommend', pathMatch : 'full' },
{ path : 'recommend', component : RecommendComponent },
{ path : 'category', component : CategoryComponent },
{ path : 'brand', component : BrandComponent },
{ path : 'recommend-detail/:id', component : RecommendDetailComponent }
] ;
@NgModule({
imports : [ RouterModule.forRoot(routes)],
exports : [ RouterModule ],
providers : [ { provide : APP_BASE_HREF, useValue : '/' }]
})
export class AppRouingModule { }
app.module.ts:
import { NgModule } from '@angular/core' ;
import { BrowserModule } from '@angular/platform-browser' ;
import { HttpModule } from '@angular/http' ;
import { YoutubePlayerModule } from 'ng2-youtube-player' ;
import { AppRouingModule } from './app.routing.module' ;
import { AppComponent } from './app.component' ;
import { HeaderComponent } from './header/header.component' ;
import { HomeComponent } from './home/home.component' ;
import { CategoryComponent } from './category/category.component' ;
import { BrandComponent } from './brand/brand.component' ;
import { RecommendComponent } from './recommend/recommend.component' ;
import { RecommendDetailComponent } from './recommend-detail/recommend-detail.component' ;
@NgModule({
imports : [
BrowserModule,
HttpModule,
YoutubePlayerModule,
AppRouingModule
],
declarations : [
AppComponent,
HeaderComponent,
HomeComponent,
CategoryComponent,
BrandComponent,
RecommendComponent,
RecommendDetailComponent
],
providers : [
],
bootstrap : [
AppComponent
]
})
export class AppModule {
}
路径' /推荐'和' / category',' / brand'浏览器刷新时页面没问题。
路径' / recommended-detail /:id'浏览器刷新时找不到404页面。
但是[routerLink] =" [' / recommended-detail',idx]"没有发生404。