Zależność od modułu Angular 2: Circular Feature

Question

Obecnie pracuję nad jedną z aplikacji Angular2. Mam w nim 3 moduły funkcyjne, które zawierają inne moduły funkcji dodatkowych. Chcę wczytać moduł funkcji podrzędnych funkcji 1 do modułu funkcji podrzędnych funkcji 2 i odwrotnie. poniżej znajduje się przykładowy kod.

akcji routing.module.ts

const routes: Routes = [ 
    { 
     path: '', 
     component: ActionComponent, 
     children: [ 
      { 
      path: ':id', 
      loadChildren: 'app/action/action-detail/action-detail.module#ActionDetailModule' 
      } 
     ] 
    } 
]; 

action-detal-routing.module.ts

const routes: Routes = [ 
    { 
     path: '', 
     component: ActionDetailComponent, 
    },  
    { 
     path: 'topic-detail/:id', 
     loadChildren: 'app/topic/decision-topic-detail/decision-topic-detail.module#DecisionTopicDetailModule', 
    } 
] 

tematycznych routing.module.ts

const routes: Routes = [ 
    { 
     path: '', 
     component: TopicComponent, 
     children: [ 
      { 
      path: ':id', 
      loadChildren: 'app/topic/decision-topic-detail/decision-topic-detail.module#DecisionTopicDetailModule' 
      } 
     ] 
    } 
]; 

decyzji wątek-detail-routing.module.ts

const routes: Routes = [ 
    { 
     path: '', 
     component: DecisionTopicDetailComponent, 
    },  
    { 
     path: 'action-detail/:id', 
     loadChildren: 'app/action/action-detail/action-detail.module#ActionDetailModule' 
    } 
] 

Stwarza cykliczną zależność i wyrzuca błąd z błąd w Maksymalny rozmiar stosu wywołań przekroczyła w czasie kompilacji.

Czy istnieje sposób na rozwiązanie tego błędu. Wiem, że jednym sposobem jest załadowanie całego modułu funkcji samemu, ale to nie jest opłacalna sytuacja.

Z góry dziękuję.

Answer 1

Trasy powinny żyć w miejscu, oddzielnie od składników i poza modułami te elementy są deklarowane.

Przez długi czas, ja poszedłem wzór używasz zbyt. topic-routing.module.tsWygląda na to, że powinien być zgodny z komponentami topic. Ale ostatnio zacząłem o tym myśleć w innym świetle, a twoja zagadka doskonale to podkreśla.

Zacząłem myśleć o routes jako sercu danej aplikacji. Ta zmiana paradygmatu nastąpiła, kiedy zacząłem pisać drugą aplikację i postanowiłem ponownie wykorzystać wiele komponentów/modułów, które napisałem w pierwszej. Zauważyłem, że jedynymi rzeczami, które nie miały sensu do ponownego wykorzystania były trasy.

To było tak, jakby trasy definiowały "aplikację", a moduły/komponenty są klockami do wykorzystania przez daną aplikację.

W tym świetle, polecam następujące:

Przenieś swoje definicje trasy z każdego modułu do górnego poziomu aplikacji. Mogliby żyć w katalogu obok app.routes, i moglibyście przechowywać je w swoich bieżących plikach, lub jeśli nie ma ich tak wielu, moglibyście po prostu scalić je w ten sam plik.

Może się to wydawać sprzeczne z intuicją, a tracisz „pionowy” grupowanie gdzie wszystko topic rzeczy mieszka z tematów i wszystkie action rzeczy mieszka z działaniami. Ale gdy patrzysz na trasy jako na zupełnie inne zwierzę niż na elementy, do których się odnoszą, wtedy jest to mniej bolesne i na pewno rozwiązuje twój problem.

src 
    |-app.component.ts 
    |-app.component.html 
    |-app.routes.ts <-- includes the routes in the sibling directory 
    |-routing 
     |- action.routes.ts 
     |- action-detail.routes.ts 
     |- topic.routes.ts 
     \- decision-topic-detail.ts 
    |-decision-topic-detail (module) 
    |-topic (module) 
    \-action (module)