Question

通常我有一个文件来定义我的路线，例如：app.routing.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { RouterModule, Routes } from '@angular/router';

import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';

import { EmpresaListaComponent } from './modules/empresa/empresa-lista/empresa-lista.component';
import { EmpresaDetalheComponent } from './modules/empresa/empresa-detalhe/empresa-detalhe.component';
import { EmpresaCadastroComponent } from './modules/empresa/empresa-cadastro/empresa-cadastro.component';
import { CidadeListaComponent } from './modules/cidadea/cidade-lista/cidade-lista.component';
import { CidadeDetalheComponent } from './modules/cidade/cidade-detalhe/cidade-detalhe.component';
import { CidadeCadastroComponent } from './modules/cidade/cidade-cadastro/cidade-cadastro.component';

const routes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'empresas', component: EmpresaListaComponent},
  { path: 'empresas/cadastro', component: EmpresaCadastroComponent},
  { path: 'empresas/:nome', component: EmpresaDetalheComponent},
  { path: 'cidades', component: CidadeListaComponent},
  { path: 'cidades/cadastro', component: CidadeCadastroComponent},
  { path: 'cidades/:nome', component: CidadeDetalheComponent},
  { path: '**', redirectTo: '/empresas' }
];

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

如何将iso分成两个文件？

例如：

empresa.routing.module.ts cidade.routing.module.ts

Answer 1

您可以在两个文件中导出路由模块并将其导入主模块：

const routes: Routes = [
 { path: 'empresas', component: EmpresaListaComponent},
 { path: 'empresas/cadastro', component: EmpresaCadastroComponent},
 { path: 'empresas/:nome', component: EmpresaDetalheComponent},

];

export const empresaRouting: ModuleWithProviders = RouterModule.forChild(routes);

第二个

const routes: Routes = [
 { path: 'cidades', component: CidadeListaComponent},
 { path: 'cidades/cadastro', component: CidadeCadastroComponent},
 { path: 'cidades/:nome', component: CidadeDetalheComponent},

];

export const cidadRouting: ModuleWithProviders = RouterModule.forChild(routes);

并添加主模块的两个导入

import { empresaRouting } from ...
import { cidadRouting } from ...
@NgModule({
imports: [
[ cidadRouting,
  empresaRouting
 ],
CommonModule,
],
declarations: []
})
export class AppRoutingModule { }

多个文件来定义路由

1 个答案: