दिलचस्प पोस्ट
संकेत और संदर्भ के बीच वास्तविक अंतर क्या है? सुनना गर्तिका साझा करने के लिए कई प्रक्रियाओं का एक तरीका है? ORA-28040: कोई मिलान प्रमाणन प्रोटोकॉल अपवाद नहीं सी # में पूर्णांक अतिप्रवाह को संभालने का सबसे अच्छा तरीका है? आने वाली कॉल स्क्रीन पर पॉपअप करें एंड्रॉइड को मेरी प्रक्रिया को मारने का अनुकरण कैसे करें मैं कैसे एक jQuery स्क्रॉल घटना की दिशा निर्धारित कर सकते हैं? PHP ऐरे से उच्चतम मूल्य प्राप्त करें JQuery के उपयोग से एचटीएमएल संस्थाओं को व्याख्या कैसे करें? PHP का उपयोग कर वेबसाइट पर ओसीआर कैसे लागू कर सकता हूं? एफ # में इरोटोथेनिनेस की छलनी एंड्रॉइड, एक छवि बनाओ ImageView की छवि के बराबर यूआरएल पर फ़ोल्डर में सभी फ़ाइलों की सूची और उप फ़ोल्डर्स एमएसआई स्थापना के बाद exe चलाएँ? डुप्लिकेट के साथ रैंडम संख्या जनरेटर

कोणीय 2 राउटर घटना श्रोता

कोणीय 2 राउटर में राज्य परिवर्तन कैसे सुनें?

कोणीय 1.x में मैं इस घटना का इस्तेमाल किया:

$rootScope.$on('$stateChangeStart', function(event,toState,toParams,fromState,fromParams, options){ ... }) 

इसलिए, यदि मैं इस ईवेंट सूचीर को कांगारू 2 में उपयोग करता हूं:

 window.addEventListener("hashchange", () => {return console.log('ok')}, false); 

यह 'ठीक' नहीं लौटा रहा है, फिर जेएस से राज्य को बदलने के लिए, केवल तब ब्राउज़र इतिहास। बैक () फ़ंक्शन रन।

सेवा के रूप में रूटर। सदस्यता का उपयोग करें:

 import {Injectable} from 'angular2/core'; import {Router} from 'angular2/router'; @Injectable() export class SubscribeService { constructor (private _router: Router) { this._router.subscribe(val => { console.info(val, '<-- subscribe func'); }) } } 

घटक में सेवा को इंजेक्ट करें जो रूटिंग में init:

 import {Component} from 'angular2/core'; import {Router} from 'angular2/router'; @Component({ selector: 'main', templateUrl: '../templates/main.html', providers: [SubscribeService] }) export class MainComponent { constructor (private subscribeService: SubscribeService) {} } 

मैं इस सेवा को अन्य घटकों जैसे कि इस उदाहरण में इंजेक्ट कर रहा हूं। तब मैं राज्य को बदलता हूं, console.info () सेवा में काम नहीं कर रहा है

मैं गलत क्या करता हूं?

Solutions Collecting From Web of "कोणीय 2 राउटर घटना श्रोता"

नया रूटर

 constructor(router:Router) { router.events.subscribe(event:Event => { if(event instanceof NavigationStart) { } // NavigationEnd // NavigationCancel // NavigationError // RoutesRecognized }); } 

पुराना

राउटर को इंजेक्ट करें और रूट परिवर्तन ईवेंट्स की सदस्यता लें

 import {Router} from 'angular2/router'; class MyComponent { constructor(router:Router) { router.subscribe(...) } } 

ध्यान दें

नए रूटर के लिए, router मॉड्यूल से NavigationStart आयात करना भूलना नहीं है

 import { Router, NavigationStart } from '@angular/router'; 

क्योंकि अगर आप इसे आयात नहीं करते हैं तो instanceof काम नहीं करेगा और एक NavigationStart is not defined जाएगा त्रुटि बढ़ जाएगी।

यह भी देखें

आप instanceof उपयोग कर सकते हैं क्योंकि @ गुंटर ज़ोचबॉयर ने उत्तर दिया

 this.router.events.subscribe(event => { if(event instanceof NavigationStart) { // do something... } } 

या आप एक आकस्मिक दृष्टिकोण का उपयोग कर सकते हैं, लेकिन याद रखना कि कंसट्रेटर का नाम आसानी से बदल सकता है, जबकि फ़ंक्शन अभी भी काम कर रहा है!

 this.router.events.subscribe(event => { if(event.constructor.name === "NavigationStart") { // do something... } }); 

कोणीय 2 राउटर की घटनाओं में अलग-अलग वर्ग हैं, और जो राउटर से सदस्यता प्राप्त हो जाता है। router.events या तो NavigationEnd router.events , NavigationCancel router.events , NavigationCancel router.events या NavigationEnd router.events हो सकता है। जो वास्तव में रूटिंग अपडेट को ट्रिगर करेगा वह NavigationEnd होगा।

मैं event.constructor.name या event.constructor.name का उपयोग करने से दूर रहना होगा क्योंकि मिनेसिंग के बाद क्लास के नाम मिलते हैं यह सही ढंग से काम नहीं करेगा।

आप राउटर के isActive फ़ंक्शन का उपयोग इसके बजाय, यहां दिखाया जा सकते हैं https://angular.io/docs/ts/latest/api/router/index/Router-class.html

 this.routerEventSubscription = this._router.events.subscribe((event: any) => { if (this._router.isActive(events.url, false)) { // true if the url route is active } } 

angular2 में, "app.modules.ts" -> आयात करने के लिए फ़ाइल पर जाएं

 RouterModule.forRoot( appRoutes, { enableTracing: true } ) 

सक्षम में true शो मार्ग को सक्षम करने में कंसोल में एल्ग्रेस झूठी छिपाने के मार्ग में कंसोल में इवेंट

सभी राज्य परिवर्तनों को सुनने के लिए, डिफ़ॉल्ट रूटरऑप्टलेट का विस्तार करें और 'सक्रिय' और 'निष्क्रिय' संचालकों में अपना स्वयं का तर्क जोड़ें

 import {Directive} from 'angular2/core'; import {Router, RouterOutlet, ComponentInstruction} from 'angular2/router'; @Directive({ selector: 'router-outlet' }) export class MyOwnRouterOutlet extends RouterOutlet { ... activate() { console.log('Hello from the new router outlet!'); } } 

यहां 'कस्टम राउटर आउटलेट' उदाहरण से कॉपी किया गया: https://auth0.com/blog/2016/01/25/angular-2-series-part-4-component-router-in-depth/