如何在延遲加載angular 2 NgModule中爲loadchildren提供正確的路徑名？

如何在angular 2 ngmodule的app-routing.module文件中爲loadchildren提供正確的路徑名稱，我遵循角主網站中的ngmodule概念，但它沒有提供此類信息。我遇到了app-routing.module路徑的問題，我需要在路徑名中指定這個問題，懶加載不工作.all文件一次加載一次，任何人都可以幫忙嗎？我在路徑loadchildrens中錯過了什麼？跟着這個 Angular NgModule 如何在延遲加載angular 2 NgModule中爲loadchildren提供正確的路徑名？

app-routing.module文件。

import { NgModule } from '@angular/core'; 
import { Routes, RouterModule } from '@angular/router'; 
import {DashboardModule} from './dashboard/dashboard.module'; 
import {VideosModule} from './videos/videos.module'; 


export const routes: Routes = [ 
    { path: 'login', component: LoginComponent }, 
    { path: '', redirectTo: 'home/dashboard', pathMatch: 'full', canActivate: [AuthGuard] }, 
    { 
     path: 'home', component: HomeComponent, canActivate: [AuthGuard], 
     children: [ 
      { path: '', loadChildren: 'app/dashboard/dashboard.module#DashboardModule' }, 
      { path: 'videos', loadChildren: 'app/videos/videos.module#VideosModule' }, 

      ] 
    }, 
];

app.module文件

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import {FormsModule, FormGroup, ReactiveFormsModule} from '@angular/forms'; 
import { CommonModule} from '@angular/common'; 

import {AppRoutingModule } from './app-routing.module'; 
import { AppComponent } from './app.component'; 
import { AuthGuard } from './auth.guard'; 
import { AuthenticationService } from './shared/services/authentication.service'; 
import {LoginComponent} from './login/login.component'; 

import {SharedModule} from './shared/share.module'; 

import {DashboardModule} from './dashboard/dashboard.module'; 
import {VideosModule} from './videos/videos.module'; 

@NgModule({ 
    imports: [ 
     BrowserModule, FormsModule, AppRoutingModule, DashboardModule, 
     SharedModule, VideosModule, 
     ReactiveFormsModule, CommonModule 
    ], 
    declarations: [AppComponent, LoginComponent 
    ], 
    exports: [], 
    providers: [ 
     AuthGuard, 
     AuthenticationService, 
      ], 
    bootstrap: [AppComponent] 
}) 

export class AppModule { }

視頻 - routing.module.ts

import { NgModule } from '@angular/core'; 
import { Routes, RouterModule } from '@angular/router'; 
import {FileUploadComponent} from './upload_videos/uploadvideo.component'; 
import {ManageVideosComponent} from './manage_videos/managevideos.component'; 


export const routes: Routes = [ 
     { path: ' ', redirectTo:'fileupload',pathMatch:'full'}, 
     { path: 'fileupload', component: FileUploadComponent },       
     { path: 'manage_videos', component: ManageVideosComponent }, 
    ]; 
@NgModule({ 
    imports: [RouterModule.forChild(routes)], 
    exports: [RouterModule] 
}) 
export class VideosRoutingModule {}

videos.module文件

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

import {FormsModule, ReactiveFormsModule} from '@angular/forms'; 
import {SharedModule} from '../shared/share.module'; 
import {VideoFileService} from './services/videofile.service'; 

import { FileSelectDirective, FileDropDirective } from 'ng2-file-upload'; 
import {FileUploadModule} from 'ng2-file-upload/ng2-file-upload'; 
import {ManageVideosComponent} from './manage_videos/managevideos.component'; 

import {VideosRoutingModule} from './videos-routing.module'; 


@NgModule({ 
    imports:  [ VideosRoutingModule,SharedModule,CommonModule, 
        FormsModule,ReactiveFormsModule ,FileUploadModule], 
    declarations: [ManageVideosComponent, 
       FileUploadComponent], 
    exports:  [ FileSelectDirective,FileDropDirective ], 
    providers: [ VideoFileService ] 
}) 
export class VideosModule { }

來源

2017-01-24 Sathish Kotha

我找到了正確的解決方案。

我們需要從app.module.ts文件中移除除了儀表板模塊以外的視頻模塊導入模塊，因爲它首先加載並且我們已經使用loadChildren的概念導入了app.routing.ts文件中的視頻模塊。因此無需導入在app.module.ts中的視頻模塊，因爲它的延遲加載，現在它的工作延遲加載罰款和路徑名稱，無論你想要什麼，你可以給，並調用路徑與路由器鏈接。只需按照下面鏈接 https://devblog.dymel.pl/2016/10/06/lazy-loading-angular2-modules/ 謝謝

來源

2017-01-26 07:27:23

如何在延遲加載angular 2 NgModule中爲loadchildren提供正確的路徑名？

回答

相關問題