Angular2 Router Hates Meine AUX Routen

Question

UPDATE 11/1/15

Aux Routen nicht sehr gut, wie von Alpha unterstützt werden 45. Link to Github Issue

Requisiten @ evan-Scholle

Ursprüngliche Frage

Ich beobachtete Brian Fords Rede auf dem Angular2 Router:

Und ich begann zu versuchen, die "Aux" Routen zu verwenden und mein Code wirft eine Tonne von Fehlern.

Ich bin auf Alpha 44 auf mgechev's Angular Seed

In meiner app.ts Komponente es ist ziemlich Standard für die RouteConfig Ich habe:

@RouteConfig([ 
    { path: '/', component: HomeCmp, as: 'Home' }, 
    { path: '/run', component: RunCmp, as: 'Run' }, 
    { path: '/manage', component: ManageCmp, as: 'Manage' }, 
    { path: '/user', component: UserCmp, as: 'User' }, 
    { path: '/settings', component: LocalSettingsCmp, as: 'Settings' }, 
    { aux: '/login', component: LoginCmp, as: 'Login' } 
]) 

Mein app.html:

<div id="main-content" class="full"> 
    <router-outlet></router-outlet> 
    <router-outlet name="login"></router-outlet> 
</div> 

Innerhalb der HomeCmp habe ich einen "Login" Link:

<p>Router Link to activate login form: <a [router-link]="['/',['Login']]">Login</a></p> 

Jetzt habe ich andere Router-Links in dieser Komponente, die gut funktionieren, aber wenn ich diese Verbindung gibt mir diesen Fehler hinzu:

Ausnahme:

EXCEPTION: "/" is only allowed at the beginning of a link DSL. in [null] 
BrowserDomAdapter.logError @ angular2.dev.js?v=0.0.0:21835 
BrowserDomAdapter.logGroup @ angular2.dev.js?v=0.0.0:21846 
ExceptionHandler.call @ angular2.dev.js?v=0.0.0:4431 
(anonymous function) @ angular2.dev.js?v=0.0.0:19543 
NgZone._onError @ angular2.dev.js?v=0.0.0:10711 
errorHandling.onError @ angular2.dev.js?v=0.0.0:10630 
run @ angular2.dev.js?v=0.0.0:141 
(anonymous function) @ angular2.dev.js?v=0.0.0:10651 
zoneBoundFn @ angular2.dev.js?v=0.0.0:111 
lib$es6$promise$asap$$flush @ angular2.dev.js?v=0.0.0:1301 
angular2.dev.js?v=0.0.0:21835 

Fehler:

Error: "/" is only allowed at the beginning of a link DSL. 
    at new BaseException (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:16034:21) 
    at RouteRegistry.generate (http://localhost:5555/lib/router.dev.js?v=0.0.0:1645:17) 
    at ChildRouter.Router.generate (http://localhost:5555/lib/router.dev.js?v=0.0.0:2044:43) 
    at RouterLink.Object.defineProperty.set [as routeParams] (http://localhost:5555/lib/router.dev.js?v=0.0.0:1323:52) 
    at AbstractChangeDetector.ChangeDetector_HomeCmp_0.detectChangesInRecordsInternal (eval at <anonymous> (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20415:14), <anonymous>:118:40) 
    at AbstractChangeDetector.detectChangesInRecords (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20209:14) 
    at AbstractChangeDetector.runDetectChanges (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20192:12) 
    at AbstractChangeDetector._detectChangesInShadowDomChildren (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20259:14) 
    at AbstractChangeDetector.runDetectChanges (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20196:12) 
    at AbstractChangeDetector._detectChangesInLightDomChildren (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20253:14) 

Kontext:

{element: a, componentElement: home, context: HomeCmp, locals: Object, injector: Injector…} 

Es wirft auch diese:

TypeError: Cannot read property 'child' of undefined 
    at ChildRouter.Router.isRouteActive (http://localhost:5555/lib/router.dev.js?v=0.0.0:1803:77) 
    at RouterLink.Object.defineProperty.get [as isRouteActive] (http://localhost:5555/lib/router.dev.js?v=0.0.0:1315:29) 
    at AbstractChangeDetector.ChangeDetector_HomeCmp_0.detectChangesInRecordsInternal (eval at <anonymous> (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20415:14), <anonymous>:153:44) 
    at AbstractChangeDetector.detectChangesInRecords (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20209:14) 
    at AbstractChangeDetector.runDetectChanges (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20192:12) 
    at AbstractChangeDetector._detectChangesInShadowDomChildren (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20259:14) 
    at AbstractChangeDetector.runDetectChanges (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20196:12) 
    at AbstractChangeDetector._detectChangesInLightDomChildren (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20253:14) 
    at AbstractChangeDetector.runDetectChanges (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20193:12) 
    at AbstractChangeDetector._detectChangesInShadowDomChildren (http://localhost:5555/lib/angular2.dev.js?v=0.0.0:20259:14) 

Aber es ist nach dem ersten Fehler, damit ich nicht sicher bin, ob seine verursacht durch das erste oder was.

Ich probierte auch die Way from the Angular2 API Docs aber es wirft die gleichen Fehler.

• Mache ich etwas falsch?
• Wird diese Syntax noch nicht unterstützt?
• Gibt es ein Beispiel, dass jemand die Aux-Routen korrekt verwendet?

HINWEIS: Ich habe versucht, den Router immer mit einem Plunker zu arbeiten, aber es tat wie die URL oder etwas sonst würde ich einen Live-Fall bietet

UPDATE 10/29/15 Die Der erste Fehler ist vom Router-Link, der es nicht erlaubt, "\" oder ". \" in irgendeiner Weise zu verwenden.Sie MÜSSEN den Routennamen angeben.

Aux funktioniert immer noch nicht ...

Answer 1

Der Router entspricht den Pfad des ersten Parameters in dem Array

In Ihrem Fall wäre es / oder Home

<a [routerLink]="['/',['Login']]">Login</a> 

entspricht Verwenden Sie stattdessen:

<a [routerLink]="['/Login']">Login</a> 

AFAIK, der Parameter ist ein Array, da eine Route auch eine oder mehrere Wildcard-Übereinstimmungen enthalten kann.

Hinweis: Die in der Verknüpfung verwendete Login zeigt auf den Alias ​​der Route (dh das Feld as).

Quelle:

• angular2/src/router/router_link.ts

Update:

Halten Sie ein Auge. Das angle2-Team plant, in einer zukünftigen Version RouterLink/<router-link> zu RouterViewport/<router-viewport> zu ändern.

Quelle: angular/issues#4679

Update2:

• [Router-link] -> [Router]