2016-11-23 164 views
0

我有以下建立(遗漏了东西为简单起见):Angular2路由功能模块重定向到内

app/ 
    *app-routing.module 
    *app.component 
    *dashboard/ 
     *dashboard-routing.module 
     *dashboard.component 
     *dashboard-home/ 
      *dashboard-home.component 

和相关的代码:

仪表板的路由选择:

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { FormsModule } from '@angular/forms'; 
import { RouterModule, Routes } from '@angular/router'; 

// owned components 
import { DashboardComponent } from './dashboard.component'; 
import { DashboardHomeComponent } from './dashboard-home/index'; 

// guards 
import { AuthGuard } from '../core/index'; 

export const dashboardRoutedComponents = [DashboardComponent, DashboardHomeComponent]; 

const routes: Routes = [ 
    { path: '', redirectTo: '/dashboard/home', pathMatch: 'full' }, 
    { 
    path: 'dashboard', 
    component: DashboardComponent, 
    canActivate: [AuthGuard], 
    children: [ 
     { 
     path: 'home', 
     component: DashboardHomeComponent 
     } 
    ] 
    } 
]; 

@NgModule({ 
    imports: [RouterModule.forChild(routes)], 
    exports: [RouterModule] 
}) 
export class DashboardRoutingModule { } 

app-routing:

import { NgModule }  from '@angular/core'; 
import { RouterModule } from '@angular/router'; 

// guards 
import { AuthGuard } from './core/index'; 

@NgModule({ 
    imports: [ 
    RouterModule.forRoot([ 
     {path: '', redirectTo: 'dashboard', pathMatch: 'full', canActivate: [AuthGuard] } 
    ]) 
    ], 
    exports: [ 
    RouterModule 
    ] 
}) 
export class AppRoutingModule {} 

export const appRoutedComponents = []; 

我的问题是,当我导航到localhost:4200时,它将我重定向到localhost:4200/dashboard。如果我然后刷新页面,它会将我从localhost:4200/dashboard重定向到localhost:4200/dashboard/home。任何想法如何让它从localhost:4200直接跳到localhost:4200/dashboard/home ??

问候

回答

0

这似乎是工作,但不知道是否正确的方法

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { FormsModule } from '@angular/forms'; 
import { RouterModule, Routes } from '@angular/router'; 

// owned components 
import { DashboardComponent } from './dashboard.component'; 
import { DashboardHomeComponent } from './dashboard-home/index'; 

// guards 
import { AuthGuard } from '../core/index'; 

export const dashboardRoutedComponents = [DashboardComponent, DashboardHomeComponent]; 

const routes: Routes = [ 
    { path: '', redirectTo: '/dashboard', pathMatch: 'full' }, 
    { 
    path: 'dashboard', 
    component: DashboardComponent, 
    canActivate: [AuthGuard], 
    children: [ 
     { 
     path: '', 
     redirectTo: 'home', 
     pathMatch: 'full' 
     }, 
     { 
     path: 'home', 
     component: DashboardHomeComponent 
     } 
    ] 
    } 
]; 

@NgModule({ 
    imports: [RouterModule.forChild(routes)], 
    exports: [RouterModule] 
}) 
export class DashboardRoutingModule { }