कोणीय 1.5 घटक में स्कोप घटनाओं को कैसे सुनें?

Question

मैं कोणीय 1.3 से कोणीय 1.5 घटकों और ES6 नियंत्रकों से कोड माइग्रेट करने के बीच में हूं। मैंने एसओ पर कुछ खोजने की कोशिश की, लेकिन पर्याप्त मददगार नहीं। नीचे उल्लिखित तरीके के अलावा दायरे पर घटनाओं को देखने के लिए आवश्यक सुझाव। या निर्देश से स्कोप घटनाओं को कैसे ट्रिगर करें। अगर कोई विकल्प मौजूद है, तो कृपया ऐसा करने का सही तरीका भी सुझाएं।

कोणीय 1,3

angular 
.module('test') 
.directive('test', function() { 
    return { 
     link: function(scope) { 
      scope.$on('$stateChangeStart', function(event, toState, toParams) { 
       //logic goes here.. 
      }); 
     } 
    } 
}); 

कोणीय 1.5/ES6

class TestController { 
    /* @ngInject */ 
    constructor($scope) { 
     this._$scope = $scope; 
    } 

    $onInit() { 
     this._$scope.$on('$stateChangeStart', (event, toState, toParams) => { 
      //logic goes here 
     }); 
    } 
} 

angular 
.module('test') 
.component('test', { 
    controller: TestController 
}); 

संपादित करें:

$ पर और नहीं $ यहाँ देख के लिए एक वैकल्पिक करने के इच्छुक हैं, $ कारण onChange $ घड़ी की जगह ले सकता जब आप केवल चर देख रहे हैं। मैं गुंजाइश घटनाओं को सुनना चाहता हूं, क्योंकि कोणीय 1.3 कोड का 100% 1.5 तक माइग्रेट नहीं किया जा सकता है, मेरे पास अभी भी दायरे पर घटनाओं को ट्रिगर करने का निर्देश है!

Answer 1

स्कोप घटनाओं को किसी सेवा में आरएक्स अवलोकनों में परिवर्तित किया जा सकता है।

app.factory("rxLocationChangeStart", function($rootScope, rx) { 
    var rxLocationChangeStart = new rx.Subject(); 
    $rootScope.$on("$locationChangeStart", function() { 
     rxLocationChangeStart.onNext(arguments); 
    }); 
    return rxLocationChangeStart; 
}) 

फिर एक घटक उन घटनाओं की सदस्यता ले सकते:

app.component("locationMonitor", { 
     scope: {}, 
     template: ['<p>oldPath={{$ctrl.oldPath}}</p>', 
        '<p>newPath={{$ctrl.newPath}}</p>'].join(''), 
     controller: function (rxLocationChangeStart) { 
     var $ctrl = this; 
     var subscr = rxLocationChangeStart.subscribe(function(data) { 
      console.log("locationChangeStart ", data); 
      $ctrl.newPath = data[1]; 
      $ctrl.oldPath = data[2]; 
     }); 
     this.$onDestroy = function() { 
      subscr.dispose(); 
     }; 
     } 
}) 

कोणीय 2 RX observables साथ गुंजाइश घटना बस बदल देता है। RX observables के दायरे घटनाओं परिवर्तित कोणीय 2.

DEMO on PLNKR को AngularJS से एक आसान पलायन का रास्ता प्रदान करता है।