कोणीय 2 नया राउटर: बाल घटक के राउटर पैरामीटर कैसे प्राप्त करें?

Question

@angular/router3.0.0-rc.1 के नवीनतम संस्करण में यूआरएल/मार्ग से पैरामीटर प्राप्त करने के तरीके को बदल दिया गया है।

this दस्तावेज के आधार पर आपको पैराम की सदस्यता ले कर पैराम प्राप्त करने में सक्षम होना चाहिए, लेकिन मेरे मामले में ऐसा लगता है कि यह काम नहीं कर रहा है।

जो मैं प्राप्त करना चाहता हूं वह है कि मेरे मूल घटक में बाल मार्गों से पैरा प्राप्त करें।

उदाहरण के लिए मान लें कि यह मेरा मार्गों है:

const routes: Routes = [ 
    { 
    path: 'parent', 
    component: ParentComponent, 
    pathMatch: 'prefix', 
    children: [ 
     { 
     path: ':id', 
     component: ChildComponent 
     } 
    ] 
    } 
]; 

मैं id पैरामीटर हो और मेरी ParentComponent में इसका इस्तेमाल करना चाहते हैं। तो मैं इस तरह कोशिश कर रहा हूँ:

export class ParentComponent implements OnInit { 

    sub: any; 
    constructor(
    private route: ActivatedRoute) { 
    this.route = route; 
    } 

    ngOnInit() { 

    this.sub = this.route.params.subscribe(params => { 
    let id = params['id']; 
    console.log(id); 
    }); 

    } 

} 

इस तरह मैं हो रही है:

अपरिभाषित

मैं यहाँ क्या याद आ रही है?

Answer 1

ActivatedRoute में अपने माता-पिता/बाल मार्ग की जानकारी तक पहुंचने के लिए गेटर्स हैं।

माता पिता से पहले बच्चे मार्ग पर पहुंचने के लिए, आप का प्रयोग करेंगे:

this.route.firstChild.params

आप सभी बच्चे जिन मार्गों पर children संपत्ति का प्रयोग करेंगे चाहते हैं तो। यह ActivatedRoute

this.route.children

की एक सरणी देता है, तो आप एक बच्चे मार्ग और जरूरत मापदंडों माता पिता से में थे:

this.route.parent.params

Answer 2

बच्चे मापदंडों जुड़े रहे हैं/बच्चे ActivatedRoute के साथ संग्रहीत। वे माता-पिता के सक्रिय मार्ग पर उपलब्ध नहीं हैं। तो आपको पहले गेटर firstChild या children का उपयोग करके बच्चे के सक्रिय मार्ग प्राप्त करने की आवश्यकता है।

फिर, माता-पिता बच्चे को पैरामीटर परिवर्तन की सदस्यता या तो कर सकते हैं:

import { Component, OnInit, OnDestroy } from '@angular/core'; 
import { ActivatedRoute }    from '@angular/router'; 
import { Subscription }     from 'rxjs/Subscription'; 

export class ParentComponent implements OnInit, OnDestroy { 
    private sub: Subscription; 
    constructor(private route: ActivatedRoute) {} 
    ngOnInit() { 
     this.sub = this.route.firstChild.params.subscribe(
     params => console.log(params.id)); 
    } 
    ngOnDestroy() { 
     this.sub.unsubscribe(); 
    } 
} 

या यह बच्चे मानकों का स्नैपशॉट प्राप्त कर सकते हैं: आप सभी को प्राप्त करना चाहते हैं

import { Component }  from '@angular/core'; 
import { ActivatedRoute } from '@angular/router'; 

export class ParentComponent { 
    constructor(private route: ActivatedRoute) {} 
    someMethod() { 
     console.log(this.route.firstChild.snapshot.params.id); 
    } 
} 

बच्चे (उदाहरण के लिए, यदि आपके पास एकाधिक आउटलेट हैं), बच्चे सक्रिय एक्टिवेटेड या बच्चे सक्रिय रूटआउटशॉट्स की एक सरणी प्राप्त करने के लिए ActivatedRoute.children या ActivatedRouteSnapshot.children का उपयोग करें।

Answer 3

this.activatedRoute.snapshot.firstChild.params