app.component.html

<a routerLink="./">Main Home</a> &nbsp;| &nbsp;
<a routerLink="./contactus">ContactUs</a> &nbsp;| &nbsp;
<a routerLink="./productmodule">Product Manager</a> &nbsp;| &nbsp;
<a routerLink="./customermodule">Customer Manager</a> &nbsp;| &nbsp;
<a routerLink="./ordermodule">Order Manager</a> &nbsp;| &nbsp;
<router-outlet></router-outlet>

app.main.router

import { Routes, RouterModule } from "@angular/router";
import { AppComponents } from "../Resource/app.Resource";
// import { ContactUsComponent } from "../Components/app.contactus.component";
 import { LandingComponent } from "../Components/LandingComponent";
 import { ContactUsComponent } from "../Components/app.contactus.component";

export const appRouters:Routes= [
    {path:'', component : LandingComponent},
    {path: "contactus",component :  ContactUsComponent },
    { path: "productmodule", loadChildren: "./Product.Module#ProductModule" },
]

export const appRouting = RouterModule.forRoot(appRouters);

Main Module

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { AppRoutingModule } from "./app.routing.module";
import { AppComponents, AppBootComponent, AppServices } from './ngObjects/Resource/app.Resource';
import {ProductComponents  } from "./SubModules/LazyModules/ProductManager/ngObjects/Resources/Product.Resources";

//import { appRouting } from "./ngObjects/Router/AppRouter";
//import { RouterModule } from '@angular/router';
@NgModule({
  declarations: [
    ...AppComponents,
  ],
  imports: [
    BrowserModule,
    FormsModule,
    CommonModule,
    AppRoutingModule,

  ],
  providers: [...AppServices],
  bootstrap: [...AppBootComponent]
})
export class AppModule { }


import { RouterModule } from '@angular/router';
import { NgModule } from '@angular/core';
import { appRouting } from "./ngObjects/Router/AppRouter";

@NgModule({
    imports: [appRouting],
    exports: [RouterModule],
    providers: []
  })
  export class AppRoutingModule {}

lazy module script 儿童HTML

<h1>Product Manager</h1>
<a routerLink="">Back</a> &nbsp;| &nbsp;
<a routerLink="home">Product Home</a> &nbsp;| &nbsp;
<a routerLink="new">New Product</a> &nbsp;| &nbsp;
<a routerLink="list">List Product</a> &nbsp;| &nbsp;

child router

import { Routes, RouterModule } from "@angular/router";
import { NewProductComponent} from "../Components/product.newitem.component";
import { ProductManagerComponent } from "../Components/Product.Manager.Component";
import { ProductHomeComponent } from "../Components/Product.Home.Component";
import { ModuleWithProviders } from "@angular/core";

export const productRouters: Routes= [

    {path:'',  component: ProductManagerComponent,

    children: [
            { path: '', redirectTo:"home" }, 
            { path: 'home', component: ProductHomeComponent  },        
            { 
                path:'new',  
                component: NewProductComponent,
            },
      ]
    },
    // { path: '', redirectTo:"home" }, 
    // { path: "home", component: ProductHomeComponent  },        
    // { 
    //     path:'new',  
    //     component: NewProductComponent,
    // },
];

export const productRouting = RouterModule.forChild(productRouters);

lazy module

import { NgModule } from "@angular/core";

import { FormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { productRouting} from "./SubModules/LazyModules/ProductManager/ngObjects/Router/product.router";
import {ProductComponents, ProductServices } from "./SubModules/LazyModules/ProductManager/ngObjects/Resources/Product.Resources";
//import {ProductManagerComponent} from "./SubModules/LazyModules/ProductManager/ngObjects/Components/Product.Manager.Component"
//import {NewProductComponent } from "./SubModules/LazyModules/ProductManager/ngObjects/Components/product.newitem.component";

@NgModule(
{
    imports:[
        CommonModule,
        FormsModule,
        productRouting,
    ],
    declarations:[
        ...ProductComponents,
 //           NewProductComponent,
 //           ProductManagerComponent,
    ],
    exports:[
       // ...Produ

ctComponents,            
        ],
        providers:[
            ...ProductServices,
        ],
        entryComponents:[
            //...ProductComponents,
        ]
    }
)
export class ProductModule
{

}

当我点击子/懒模块routerLink浏览器的链接正确更新但组件没有显示在插座区域时,

当我在主路由器和子路由器html中添加router-outlet时,引发了异常 .

ProductManagerComponent.html:6 ERROR Error: No component factory found for ProductHomeComponent. Did you add it to @NgModule.entryComponents?

如果我从子路由器html中删除了 < router-outlet > < / router-outlet >,则删除了错误但组件未显示如果我将路径从子路由器链接移动到惰性模块中的父节点,则会出现延迟模块的组件,但会删除链接 .

有人可以告诉我代码中的错误是什么?