angularjs - angular.js ui-route कैसे रूट या यूआरएल या परामर्शी को अस्वीकार करने के बाद?




angular-ui-router (2)

हम $ स्थान सेवा का उपयोग कर सकते हैं एक काम डेमो है

.run(['$rootScope', '$state', '$location',

  function ($rootScope, $state, $location) {
    $rootScope.$on('$stateChangeError', 

    function(event, toState, toParams, fromState, fromParams){
      console.log($location.url())
    });

}])

डॉक्टर का हवाला देते हुए:

url([url]);

इस विधि में गेटर / सेटर है
यूआरएल लौटें (जैसे / पथ? ए = बी # हैश) जब किसी भी पैरामीटर के बिना फोन किया जाता है
पथ, खोज और हैश बदलें, जब पैरामीटर से कॉल किया जाता है और $ स्थान वापस आ जाता है।

// given url http://example.com/#/some/path?foo=bar&baz=xoxo
var url = $location.url();
// => "/some/path?foo=bar&baz=xoxo"

काम करने वाले डेमो से पता चलता है कि राज्य को परिभाषित किया गया है:

  .state('rejected', {
      url: "/rejected{any:.*}",
      templateUrl: 'tpl.html',
      resolve: {
        loadRoute: ['Loader', function(Loader){
          return Load.load()
        }]
      }
  })

जब इस तरह से नेविगेट किया गया:

<a href="#/rejected?par1=x&amp;para2=y">
<a href="#/rejected/other">

कंसोल में प्रवेश करेगा

/rejected?par1=x&amp;para2=y
/rejected/other

डेमो को यहां देखें

मैं url पैरामेट या मार्ग या जब राज्य को अस्वीकार कर दिया गया है पर कब्जा करना चाहते हैं:

परिभाषित राज्य

app.config(['$stateProvider',
function($stateProvider) {
$stateProvider.state('categories', {
  url: '/categories',
  templateUrl: 'categories/views/index.html',
  resolve: {
   loadRoute: app.loadRoute
  }
 });
}
]);

संकल्प को परिभाषित करें, डिफ़ॉल्ट अस्वीकार करें

app.loadRoute = function ($q, $timeout) {
var deferred = $q.defer();
$timeout(deferred.reject);

return deferred.promise;
};

और init कैच त्रुटि के लिए रन अस्वीकार

app.run(['$rootScope', function($rootScope) {
 $rootScope.$on('$stateChangeError',
  function(event, toState, toParams, fromState, fromParams) {       
//.....
  });
}]);

अगर मेरे यूआरएल उदा / श्रेणियां हैं? परम = 1 & पैराट्यूब = 2 मैं इस यूआरएल को कैक्ट करना चाहता हूं जब इस यूआरएल को जारी रखना मान्य है

कैसे इस यूआरएल कैथ? घटना पर अस्वीकार


मेरे पास कुछ सुझाव हैं:

1. URL और पैरामीटर प्राप्त करना

  • आपको $location का उपयोग करने की आवश्यकता नहीं है
  • चूंकि आप यूआई-राउटर का उपयोग कर रहे हैं, इसलिए आप उन्हें toState.url साथ मिल सकते हैं।

2. $stateChangeError में error तर्क का उपयोग करना

आप $ stateChangeError इवेंट व्यूअर में एक error तर्क जोड़ सकते हैं:

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

दस्तावेज़ीकरण के अनुसार,

यह ध्यान रखना महत्वपूर्ण है कि यदि आपके resolve functions (जावास्क्रिप्ट त्रुटियों, गैर-मौजूद सेवाओं, आदि) में आपके पास कोई त्रुटि है, तो वे पारंपरिक रूप से नहीं फेंकेंगे आपको इस $ राज्य के लिए सभी त्रुटियों को पकड़ने के लिए बदलेंअरँग इवेंट सुनना चाहिए। यूआरएल को पिछले वैध स्थान (यूआरएल नेविगेशन के मामले में) में बदलने से $ UrlRouter को रोकने के लिए event.preventDefault() का उपयोग करें।

3. deferred.reject() कॉलिंग

  • अधिक महत्वपूर्ण बात , आपके कॉल को deferred.reject करने के लिए। $timeout(deferred.reject); में $timeout(deferred.reject); फ़ंक्शन कॉल नहीं है
  • इसे deferred.reject() होना चाहिए deferred.reject() - (कोष्ठक को मत भूलना)

4. उदाहरण

यहां एक उदाहरण है, जो 'TEST_ERROR' त्रुटि के साथ एक सेकंड के बाद वादा को अस्वीकार करता है व्यूअर उस त्रुटि को लॉग करता है, इरादा राज्य url, और यह पैरामीटर है जब त्रुटि निकाल दी जाती है।

संकल्प:

  resolve: {
    errorObj: function($q, $timeout) {
      var deferred = $q.defer();
      $timeout(function() {
        deferred.reject("TEST_ERROR");
      }, 1000);
      return deferred.promise;
    }
  }

देखने वाला:

$rootScope.$on("$stateChangeError", function(event, toState, toParams, fromState, fromParams, error) {
  event.preventDefault();
  if (error === "TEST_ERROR") {
    console.log("ERROR:", error, "URL:", toState.url, "PARAMS:", toParams);
  }
});




angular-ui-router