2015-10-28 18 views
8

अद्यतन 11/1/15Angular2 रूटर नफरत मेरे AUX मार्गों

औक्स मार्गों @ इवान-एक प्रकार की मछली के लिए 45. Link to Github Issue

रंगमंच की सामग्री अल्फा के रूप में बहुत अच्छी तरह से समर्थित नहीं हैं

मूल प्रश्न

मैंने एंगुलर 2 राउटर पर ब्रायन फोर्ड की बात देखी: https://youtu.be/z1NB-HG0ZH4

और मैंने "ऑक्स" मार्गों को आजमाने और उपयोग करने लगे और मेरा कोड त्रुटियों का एक टन फेंक रहा है।

मैं mgechev's Angular Seed

मेरी app.ts घटक में पर अल्फा 44 पर हूँ यह बहुत मानक, RouteConfig के लिए मैं है:

@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' } 
]) 

मेरे app.html:

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

होमकंप के अंदर मैंने एक "लॉगिन" लिंक डाला:

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

अब मुझे लगता है कि घटक है कि ठीक से काम में अन्य रूटर लिंक है, लेकिन जब मैं जोड़ने के लिए इस लिंक पर मुझे इस त्रुटि देता है:

अपवाद:

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 

त्रुटि:

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) 

संदर्भ:

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

यह इसके अलावा इस फेंकता है:

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) 

लेकिन यह पहली त्रुटि के बाद है, तो मुझे यकीन है कि अगर पहली या क्या द्वारा अपने वजह से नहीं कर रहा हूँ।

मैंने Way from the Angular2 API Docs भी कोशिश की लेकिन यह वही त्रुटियां फेंकता है।

  • क्या मैं कुछ गलत कर रहा हूं?
  • क्या यह वाक्यविन्यास अभी तक समर्थित नहीं है?
  • क्या ऑक्स रूट का उपयोग कर किसी का सही उदाहरण है?

नोट: मैं एक Plunker के साथ काम करने रूटर हो रही करने की कोशिश की लेकिन यह यूआरएल या कुछ और की तरह does not अन्यथा मैं एक जीवित मामले उपलब्ध कराएंगे

अद्यतन 10/29/15 पहली त्रुटि राउटर लिंक से है जो आपको किसी भी तरह से "\" या "। \" का उपयोग नहीं करने देती है।आपको मार्ग का नाम निर्दिष्ट करना होगा।

औक्स अभी भी काम नहीं करता है ...

उत्तर

3

routerLink यह / या Home

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

से मेल खाएंगे सरणी

आपके मामले में में पहले पैरामीटर के रास्ते से मेल खाता है इसके बजाए इसका उपयोग करें:

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

AFAIK, पैरामीटर एक सरणी है क्योंकि एक मार्ग में एक या अधिक वाइल्डकार्ड मैचों को भी शामिल किया जा सकता है।

नोट: Login मार्ग के ऊपरी भाग (यानी as फ़ील्ड) के लिंक बिंदुओं में उपयोग किया जाता है।

स्रोत:

अद्यतन:

नज़र रखें बाहर। कोणीय 2 टीम भविष्य में रिलीज में RouterLink/<router-link>RouterViewport/<router-viewport> को बदलने की योजना बना रही है।

स्रोत: angular/issues#4679

Update2:

  • [रूटर लिंक] -> [routerLink]
+1

मेरा मानना ​​है कि वे बदल रहे हैं '<रूटर-आउटलेट>' '' –

+0

तो आपका लिंक ** मानक ** राउटर लिंक के लिए सही है, लेकिन एकाधिक आउटलेट और "ऑक्स" लिंक का उपयोग करते समय वे sho ऑक्स के नाम को निर्दिष्ट करने के लिए दूसरे पैरामीटर के रूप में एक सरणी का उपयोग कर w। जो काम नहीं करता है ... इरादा एक घटक पर एकाधिक '<राउटर-आउटलेट>' है, लेकिन यह मेरे लिए काम नहीं कर रहा है। मेरा उपयोग केस लॉगिन/रजिस्टर फॉर्म के लिए है जो बात से उदाहरण है ... –

+0

हाँ ... मुझे एहसास हुआ कि तथ्य के बाद। ऐसा लगता है कि वे अभी भी इस पर काम कर रहे हैं https://github.com/angular/angular/issues/4319 –

संबंधित मुद्दे