Почему угловые 6 loadChildren не работают? - PullRequest
Новая
       30

Почему угловые 6 loadChildren не работают?

0 голосов
/ 06 декабря 2018

Я новичок в angular, поэтому я изучаю видеокурс Удеми "Angular6 The Complete Guide" Максимилиана Шварцмюллера.Я почти заканчиваю курс, но застрял с ленивой загрузкой в ​​главе «Добавление ленивой загрузки в модуль рецептов» в разделе «Понимание угловых модулей и оптимизация приложений».В этом инструктор разделяет все модули рецептов и модуль маршрутизации.Я попытался сделать то же самое для модуля покупок, который имеет модуль маршрутизации на корневом уровне приложения -app-routing.module.ts

1) app-routing.module.ts код 

  import { NgModule } from '@angular/core';
  import { Routes, RouterModule } from '@angular/router';
  import { ShoppingListComponent } from './shopping-list/shopping-list.component';
  import { HomeComponent } from './home/home.component';

  const appRoutes: Routes = [
    { path: '', component: HomeComponent },
    { path: 'recipes', loadChildren: './recipes/recipes.module#RecipesModule'},
    { path: 'shopping-list', loadChildren: './shopping-list/shopping-list.module#ShoppingListModule'}
  //  { path: 'shopping-list', component: ShoppingListComponent }
  ];
  @NgModule({
  imports: [RouterModule.forRoot(appRoutes)],
  exports: [RouterModule]
  })
  export class AppRoutingModule {

  }

2) app.module.ts code 

      import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';

  // added below two
  import { HttpModule } from '@angular/http';
  import { AppComponent } from './app.component';
  // added header component
  // import { HeaderComponent } from './header/header.component';
  import { HeaderComponent } from './header/header.component';
  import { ShoppingListService } from './shopping-list/shopping-list.service';
  import { AppRoutingModule } from './app-routing.module';
  import { RecipeService } from './recipes/recipe.service';
  import { DataStorageService } from './shared/data-storage.service';
  import { AuthService } from './auth/auth.service';
  import { AuthGuard } from './auth/auth-guard.service';
  import { SharedModule } from './shared/shared.module';
  // import { ShoppingListModule } from './shopping-list/shopping-list.module';
  import { AuthModule } from './auth/auth.module';
  import { HomeComponent } from './home/home.component';


  @NgModule({
    declarations: [
      AppComponent,
      // add header comp
      HeaderComponent,
      HomeComponent
        ],
    imports: [
      BrowserModule,
      // add Forms and HTTP module
      // FormsModule,
      HttpModule,
      AppRoutingModule,
      SharedModule,
      // ShoppingListModule,
      AuthModule
    ],
    providers: [ShoppingListService, RecipeService, DataStorageService, AuthService, AuthGuard],
    bootstrap: [AppComponent]
  })
  export class AppModule { }

Итак, почему эта строка кода не работает, даже если нет ошибок вообще? 

{ path: 'shopping-list', loadChildren: './shopping-list/shopping-list.module#ShoppingListModule'}

Я прикрепил свойструктура файла проекта изображение PROJECT FILE STRUCTURE

1 Ответ

0 голосов
/ 06 декабря 2018

Поскольку у вас нет модуля маршрутизации списка покупок

...