angular 2默认路由更改为子路由

时间:2017-05-25 07:33:32

标签: angular2-routing

我遇到了默认路由的问题,之前它曾经正常工作但现在当我点击域名/根页面时,它会被重定向到经过身份验证的仪表板页面,这是一个Lazy Load NgModule并再次被重定向到登录页面,因为他没有经过身份验证的用户的任何凭据。

为什么会发生这种情况,最近我已经转向棱角分明4.1.2 - 但我非常确定它之前的工作正常,角度v2到v4不是问题的真正原因。

我的路线是:

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

import { AppComponent } from './app.component';
import { HomeComponent } from './pages/home/home.component';
import { LoginComponent } from './pages/adviser/login/login.component';
// import { DashboardModule } from './pages/adviser/dashboard/dashboard.module'
import { Page404Component } from './pages/page404/page404.component';
import { AuthGuardService } from './shared/services/auth-guard.service';
import { PrivacyPolicyComponent } from './pages/privacy-policy/privacy-policy.component';
import { TermsConditionComponent } from './pages/terms-condition/terms-condition.component';

export const appRoutes: Routes = [
  { path: 'home', component: HomeComponent },
  { path: 'login', component: LoginComponent },
  { path: 'privacy-policy', component: PrivacyPolicyComponent },
  { path: 'terms-condition', component: TermsConditionComponent },
  { path: 'dashboard', canActivate: [AuthGuardService], loadChildren: 'app/pages/adviser/dashboard/dashboard.module#DashboardModule' },
  { path: 'funds', loadChildren: 'app/pages/funds/funds.module#FundsModule' },
  { path: '', pathMatch: 'full', redirectTo: '/home' },
  { path: '**', pathMatch: 'full', component: Page404Component }
];

我的app.module是:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule, BrowserXhr } from '@angular/http';
import { RouterModule, Routes } from '@angular/router';
import { appRoutes } from './app.routes';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

import { AppComponent } from './app.component';
import { ContactComponent } from './pages/contact/contact.component';
import { HomeComponent } from './pages/home/home.component';
import { LoginComponent } from './pages/adviser/login/login.component';
import { DashboardModule } from './pages/adviser/dashboard/dashboard.module';
import { Page404Component } from './pages/page404/page404.component';
import { HttpService } from './shared/services/http.service';
import { InstrumentService } from './shared/services/instrument.service';
import { WindowRef } from './shared/services/window-ref.service';
import { CredentialsService } from './shared/services/credentials.service';
import { ConstantService } from './shared/services/constant.service';
import { CryptService } from './shared/services/crypt.service';
import { AuthGuardService } from './shared/services/auth-guard.service';
import { PrivacyPolicyComponent } from './pages/privacy-policy/privacy-policy.component';
import { TermsConditionComponent } from './pages/terms-condition/terms-condition.component';
import { NgProgressModule, NgProgressCustomBrowserXhr } from 'ngx-progressbar';
import { Ng2PageScrollModule } from 'ng2-page-scroll';

@NgModule({
  declarations: [
    AppComponent,
    ContactComponent,
    HomeComponent,
    LoginComponent,
    Page404Component,
    PrivacyPolicyComponent,
    TermsConditionComponent
  ],
  imports: [
    NgProgressModule,
    BrowserModule,
    BrowserAnimationsModule,
    Ng2PageScrollModule.forRoot(),
    FormsModule,
    HttpModule,
    DashboardModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [HttpService, CredentialsService, ConstantService,
    AuthGuardService, CryptService, WindowRef,InstrumentService,
    { provide: BrowserXhr, useClass: NgProgressCustomBrowserXhr }],
  bootstrap: [AppComponent]
})
export class AppModule { }

我的Dashbaord.module是

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

import { HttpService } from '../../../shared/services/http.service';
import { InstrumentService } from '../../../shared/services/instrument.service';
import { WindowRef } from '../../../shared/services/window-ref.service';
import { CredentialsService } from '../../../shared/services/credentials.service';
import { ConstantService } from '../../../shared/services/constant.service';
import { CryptService } from '../../../shared/services/crypt.service';
import { AuthGuardService } from '../../../shared/services/auth-guard.service';
import { AutoCompleteComponent } from '../../../shared/plugin/auto-complete/auto-complete.component';
import { MilliToDatePipe } from '../../../shared/pipes/milli-to-date.pipe';
import { PercentagePipe } from '../../../shared/pipes/percentage.pipe';
import { NseBsePipe } from '../../../shared/pipes/nse-bse.pipe';
import { INRCurrencyPipe } from '../../../shared/pipes/inr-currency.pipe';
import { NumberFormatPipe } from '../../../shared/pipes/num.pipe';
import { RiskPipe } from '../../../shared/pipes/risk.pipe';
import { LogPipe } from '../../../shared/pipes/log.pipe';
import { ChartsModule } from 'ng2-charts';
import { NgProgressModule, NgProgressCustomBrowserXhr } from 'ngx-progressbar';
import { Ng2PageScrollModule } from 'ng2-page-scroll';
import { InstrumentPipe } from '../../../shared/pipes/instrument.pipe';
import { TruncatePipe } from '../../../shared/pipes/truncate.pipe';

import { DashboardComponent} from './dashboard.component';
import { dashboardRouting } from './dashboard.routing';

@NgModule({
  imports: [
    CommonModule,
    dashboardRouting,
    ChartsModule,
    FormsModule    
  ],
  declarations: [
    DashboardComponent,
    AutoCompleteComponent,
    MilliToDatePipe,
    PercentagePipe,
    NumberFormatPipe,
    INRCurrencyPipe,
    NseBsePipe,
    RiskPipe,
    LogPipe,
    InstrumentPipe,
    TruncatePipe
  ],
  providers: [HttpService, CredentialsService, ConstantService,
    AuthGuardService, CryptService, WindowRef, InstrumentService]
})
export class DashboardModule { }

我的信息中心路由

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from './dashboard.component';

const dashboardRoutes: Routes = [
  { path: '', component: DashboardComponent }  
];

export const dashboardRouting: ModuleWithProviders = RouterModule.forChild(dashboardRoutes);

1 个答案:

答案 0 :(得分:1)

我通过从app.module.ts文件中删除以下导入来解决此问题

  1. DashboardModule
  2. FundsModule
  3. 因为这2人被延迟加载,因此产生了一个问题