如何适当地延迟加载角组件?

问题描述 投票:0回答:1

我在Angular中坚持一些简单的路线管理:我有第一个模块:

import { NgModule } from '@angular/core';
import { Routes } from '@angular/router';
import { RouterModule } from '@angular/router';
import { LayoutComponent } from './ui/components/layout/layout.component';


const routes: Routes = [{ path: '**',
     component: LayoutComponent,
     children: [    { path: '', redirectTo: '/posts', pathMatch: 'full'},
    { path: 'posts',loadChildren: './posts/posts.module#PostsModule' }] }];

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

以及应该显示简单的“有效”组件的“ PostModule”:

import { NgModule } from '@angular/core';\n
import { Routes } from '@angular/router';\n
import { RouterModule } from '@angular/router';
import { PostsComponent } from './containers/posts/posts.component';
import { ProfileComponent } from './containers/profile/profile.component';

const routes: Routes = [{ path: '', component: PostsComponent },{ path: ':profileId', component: ProfileComponent },];

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

但没有路线

http://localhost:4200/posts/

http://localhost:4200/posts/1

显示期望的内容

我想我错过了一些简单的我的app.component看起来像这样:

   <router-outlet>
      <router-outlet></router-outlet>
   </router-outlet>

我已经读过一些有关“延迟加载”的文章,但是从我到目前为止所学到的东西来看,我写的东西似乎是连贯的,错误在哪里?

angular lazy-loading angular-load-children
1个回答
0
投票

您是否尝试过以下活动?

© www.soinside.com 2019 - 2024. All rights reserved.