Как добавить модуль маршрутизации в существующий модуль в angular CLI версии 1.1.1?

Ответ 1

Это не проблема вообще.

Просто добавьте маршрутизацию вручную.

Все, что --routing флаг --routing, помимо добавления <router-outlet></router-outlet> в app.component.html, это добавление RouterModule.forRoot() q RouterModule.forRoot() в отдельный модуль под названием AppRoutingModule и включение этого модуль в imports AppModule.

Так, в app.module.ts, он добавляет AppRoutingModule к imports вашего AppModule.

AppRoutingModule определяется как app-routing.module.ts, который создается из этого шаблона.

Это очень мало, что я скопирую это здесь:

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

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

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

{path: '', children:[]} - это просто заполнитель, который вы должны заменить (я знаю, потому что я добавил его в исходный код). Он просто гарантирует, что маршрутизатор не будет жаловаться на <router-outlet> когда у вас нет маршрутов.

Итак, вернемся к вопросу, что делать? Либо скопируйте файл в свой проект, чтобы он выглядел точно так же, как исходный CLI, и добавьте AppRoutingModule в ваш imports AppModule...

Или просто добавьте RouterModule.forRoot([/* routes here */]) вместо imports вашего AppModule. Это все еще будет работать, со встроенной поддержкой отложенной загрузки, а все остальное работает просто отлично.

PS

Помните, что для добавления дочерних маршрутов вы всегда можете сгенерировать больше модулей с маршрутизацией и ng generate module Foo --routing независимо от того, использовали ли вы флаг --routing с ng new или нет. Никакой конфигурации или какой-либо магии, о которой стоит беспокоиться.

Ответ 2

1. ng generate module app-routing-module --module app --flat
   • Замените app на имя вашего существующего модуля
   • Замените app-routing-module на имя, чтобы дать модулю маршрутизации

2. В новом модуле добавьте appRoutes и RouterModule.forRoot или RouterModule.forChild.

   // import { ... } from '...';
   
   const appRoutes: Routes = [
       { path: 'some-path', component: SomeComponent }
   ];
   
   @NgModule({
       imports: [
           RouterModule.forRoot(appRoutes)
       ],
       exports: [
           RouterModule
       ]
   })
   export class AppRoutingModule {}
   

3. При необходимости добавьте <router-outlet></router-outlet> к вашему компоненту (например, app.component.html)

Источник