2016-11-25 5 views
0

Ich habe mich seit gestern am Kopf kratzt und kann nicht herausfinden, wie ich mein Problem beheben kann. Ich habe eine Parent: Dashboard-Komponente, die einen Seitenkopf und Dropdown-Listen enthält. Meine Kindkomponente enthält momentan nur eine Zeile: "Child Component! Chosen value from dropdown list: "Some value"". Bitte schauen Sie sich die Bilder unten an.Angular 2 Kind und Elternteil (webpack, TS, Angular 2 final)

Die Kommunikation funktioniert gut, aber ich habe Probleme beim Navigieren zum Dashboard.

Meine Strecken wie folgt aussieht:

{ 
    path: 'admin', 
    component: AdminComponent, 
    children: [ 
     { 
      path: '', 
      component: AdminComponent, 
     }, 
     { 
      path: 'something/:name', 
      component: TestComponent, 
     }, 
    ] 
}, 

Falls ich nicht hinzufügen:

 { 
      path: '', 
      component: AdminComponent, 
     }, 

in der Route Kinder, erhalte ich Fehler:

Uncaught (in promise): Error: Cannot match any routes: 'admin' 
Error: Cannot match any routes: 'admin' 

Aber auch bedeutet, dass, wenn ich das in Kinder hinzugefügt habe, die Elternansicht zweimal angezeigt wird.

Es ist alles in Ordnung, wenn ich ein Element aus der Dropdown-Liste auswählen, die die untergeordnete Ansicht auslöst, die Ansicht sieht genauso aus wie es sollte, die übergeordnete Ansicht mit Dropdown-Listen und die untergeordnete Textzeile.

Ich habe versucht, die Linien bei Kindern Route zu ändern:

children: [ 
     { 
      path: '', 
      component: AdminComponent, 
     }, 
     { 
      path: 'something/:name', 
      component: TestComponent, 
     }, 
    ] 

zu:

children: [ 
     { 
      path: '', 
      redirectTo: 'admin', 
     }, 
     { 
      path: 'something/:name', 
      component: TestComponent, 
     }, 
    ] 

Aber es funktioniert nicht, es zu diesem

+0

Können Sie bitte einen Plunker mit Ihrem Code angeben? –

+0

Childeren und Elternroute 'component' sind die gleichen wie' DashboardComponent', glauben Sie nicht, dass das eine Endlosschleife verursachen wird? –

+1

@ PankajParkar Routing und Komponente kann separat gesehen werden. nur wenn es eine Umleitung in der 'DashboardComponent' gibt, sollte es funktionieren. Nicht wie erwartet, aber es funktioniert;) – PierreDuc

Antwort

1

Änderung:

children: [ 
     { 
      path: '' 
     }, 
     { 
      path: 'something/:name', 
      component: TestComponent, 
     }, 
] 

Dies wird nur rendern Ding in Ihrem router-outlet auf einem leeren Pfad. Eine andere Möglichkeit könnte darin bestehen, den leeren Pfad auf something umzuleiten und eine Platzhalterkomponente zu sagen: "Wähle eine Krankheit".

+0

Perfekt !! So einfach, lol. Ja, das hat mein Problem gelöst, super, danke! – Alex