각도 2 ngmodule의 app-routing.module 파일에서 loadchildren에 올바른 경로 이름을 지정하는 방법, 각도 메인 웹 사이트에서 ngmodule 개념을 따랐습니다. 그러나 그러한 정보를 제공하지 않습니다. app-routing.module 경로에서 문제가 발생합니다. 경로 이름에서 지정해야하는 것은 무엇입니까? 이 문제로 인해 게으른 로딩이 작동하지 않습니다. 모든 파일이 한 번만로드되는데 아무도 도와 줄 수 있습니까? 내가 loadchildrens 경로에서 그리워? 이것을 따라 갔다.Angular NgModule
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 { }
videos-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 { }
올바른 해결책을 찾았습니다.
대시 보드 모듈을 제외하고 app.module.ts 파일에서 비디오 모듈 가져 오기 모듈을 제거해야합니다. 먼저로드하는 것이고 loadChildren 개념을 사용하여 app.routing.ts 파일에 비디오 모듈을 가져옵니다. 따라서 비디오 모듈을 가져올 필요가 없습니다. app.module.ts는 게으른로드로 인해 작업량이 적어지기 때문에 경로명과 경로명을 원하는대로 지정할 수 있으며 라우터 링크로 경로를 호출 할 수 있습니다.https://devblog.dymel.pl/2016/10/06/lazy-loading-angular2-modules/감사