कोणीय 2: location.go (url)

Question

का उपयोग कर यूआरएल पर नेविगेट करने में असमर्थ। मैं टाइपस्क्रिप्ट फ़ंक्शन से location.go सेवा का उपयोग करके एक विशिष्ट यूआरएल पर नेविगेट करने का प्रयास कर रहा हूं। यह ब्राउज़र में यूआरएल बदलता है लेकिन यूआरएल का घटक स्क्रीन में दिखाई नहीं देता है। यह लॉगिन (वास्तविक) स्क्रीन पर रहता है - उदाहरण के लिए कहते हैं:

constructor(location: Location, public _userdetails: userdetails){ 
    this.location = location; 
} 
login(){ 
    if (this.username && this.password){ 
     this._userdetails.username = this.username; 
     this.location.go('/home'); 
    } 
    else{ 
     console.log('Cannot be blank'); 
    } 
} 

वहाँ एक संकलन विधि या एक ताज़ा विधि मुझे याद आ रही है?

Answer 1

हां, एक मार्ग से दूसरे मार्ग पर रीडायरेक्ट करने के लिए आपको location.go का उपयोग नहीं करना चाहिए, यह आमतौर पर ब्राउज़र पर normalized url प्राप्त करता था।

Location docs ने नीचे दिए गए नोट का कड़ाई से उल्लेख किया है।

नोट: रूट परिवर्तनों को ट्रिगर करने के लिए राउटर सेवा का उपयोग करना बेहतर है। स्थान केवल तभी स्थान पर रखें जब आपको रूटिंग के बाहर सामान्यीकृत URL पर बातचीत करने या बनाने की आवश्यकता हो।

बल्कि आप Router एपीआई navigate विधि है, जो ['routeName'] ले जाएगा के रूप में आप यह कर, जबकि [routerLink] निर्देशों का उपयोग href बनाने का उपयोग करना चाहिए।

आप यूआरएल के माध्यम से अनुप्रेषित तो ही आप navigateByUrl जो की तरह router.navigateByUrl(url)

import { 
    ROUTER_DIRECTIVES, 
    RouteConfig, 
    ROUTER_PROVIDERS, 
    Location, //note: in newer angular2 versions Location has been moved from router to common package 
    Router 
} from 'angular2/router'; 

constructor(location: Location, 
      public _userdetails: userdetails, 
      public _router: Router){ 
    this.location = location; 
} 
login(){ 
    if (this.username && this.password){ 
     this._userdetails.username = this.username; 
     //I assumed your `/home` route name is `Home` 
     this._router.navigate(['Home']); //this will navigate to Home state. 
     //below way is to navigate by URL 
     //this.router.navigateByUrl('/home') 
    } 
    else{ 
     console.log('Cannot be blank'); 
    } 
} 

अद्यतन

स्ट्रिंग के रूप में यूआरएल लेता है आगे के अध्ययन में इस्तेमाल कर सकते हैं चाहता था, तो मैंने पाया कि, जब आप navigate कहते हैं, मूल रूप से यह routeName सरणी के अंदर स्वीकार करता है, और यदि पैरामीटर हैं तो ['routeName', {id: 1, name: 'Test'}] जैसे पास होना चाहिए।

नीचे Router की navigate समारोह के एपीआई है।

Router.prototype.navigate = function(linkParams) { 
    var instruction = this.generate(linkParams); //get instruction by look up RouteRegistry 
    return this.navigateByInstruction(instruction, false); 
}; 

linkParamsgenerate कार्य करने के लिए पारित कर दिया है, यह अन्य compoent पर नेविगेट करने के लिए आवश्यक सभी Instruction के बाहर वापसी करता है। यहां Instruction का अर्थ है ComponentInstruction जिसमें रूटिंग के बारे में सारी जानकारी है, मूल रूप से हम @RouteConfig के अंदर पंजीकरण करते हैं, RouteRegistry में जोड़ा जाएगा (path पर Component को router-outlet पर असाइन करना चाहिए)।

अब पुनः प्राप्त निर्देश के navigateByInstruction विधि है, जो घटक लोड करने के लिए जिम्मेदार है और विभिन्न बात की तरह urlParams & माता पिता & बच्चे घटक अनुदेश घटक उपलब्ध कराएंगे, अगर वे देखते हैं के लिए पारित हो जाता है।

निर्देश (कंसोल में)

auxInstruction: Object //<- parent instructions 
child: null //<- child instructions 
component: ComponentInstruction //<-current component object 
specificity: 10000 
urlParams: Array[0] <-- parameter passed for the route 
urlPath: "about" //<-- current url path 

नोट: पूरे जवाब पुराने रूटर संस्करण, जब कोणीय 2 बीटा रिलीज में किया गया था पर आधारित है।