Question

不好意思，我正在关注有角度的文档。我正在创建两个功能模块，第二个正在工作，但第一个没有。我的代码在这里：

app-routing.module

    { path: 'customer', loadChildren: './customers/customers.module#CustomersModule'},  
  { path: 'orders', loadChildren: './orders/orders.module#OrdersModule'},

orders-routing.module

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { OrdersListComponent } from './orders-list/orders-list.component';

const routes: Routes = [
  { path: '', component: OrdersListComponent },
];

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

一切正常。

customers-routing.module

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CustomersListComponent } from './customers-list/customers-list.component';

const routes: Routes = [
  { path: '', component: CustomersListComponent },
];

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

未加载，它会转到其路径，但未加载组件

customers-list.component.ts

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-customers-list',
  template: `<p>customers-list works!!</p>`,
  styleUrls: ['./customers-list.component.css']
})
export class CustomersListComponent implements OnInit {

  constructor() {
    console.log('customers component launched');
  }

  ngOnInit() {
  }

}

app.component.html

<h2>{{ title }}</h2>
<ul>
  <li><button routerLink="/customer">Customers</button></li>
  <li><button routerLink="/orders">Orders</button></li>
  <li><button routerLink="">Home</button></li>
</ul>
<router-outlet></router-outlet>
<div>
  <app-publi [ads]="ads"></app-publi>
</div>

我没有任何错误控制台，所以我不知道会发生什么？

有人可以帮助我吗？谢谢。

HTML功能模块未加载Angular 6

0 个答案: