AngularJS

Question

में निर्देशक टेम्पलेट लोड करने में 404 त्रुटियों का प्रबंधन कैसे करें AngularJS निर्देश templateUrl पैरामीटर को डायनामिक रूप से परिभाषित किया गया है।

'templates/' + content_id + '.html' 

मैं अगर content_id मूल्य मान्य है की जाँच करें और 404 त्रुटियों, अर्थात् के रूप में यह प्रबंधन करने के लिए करता है, तो टेम्पलेट मौजूद नहीं है नियमों को स्थापित करने के लिए नहीं करना चाहती लोड template/404.html (सर्वर ने 404 त्रुटि जब टेम्पलेट लोड हो रहा है वापसी) बजाय।

मैं यह कैसे कर सकता हूं?

संपादित: वर्तमान उत्तर प्रतिक्रिया त्रुटि इंटरसेप्टर का उपयोग करने का सुझाव देते हैं। इस मामले में ¿मैं कैसे जान सकता हूं कि प्रतिक्रिया इस टेम्पलेट की लोडिंग के लिए है?

Answer 1

आपको प्रतिक्रिया त्रुटि इंटरसेप्टर लिखने की आवश्यकता होगी। कुछ इस तरह:

app.factory('template404Interceptor', function($injector) { 
    return { 
     responseError: function(response) { 
      if (response.status === 404 && /\.html$/.test(response.config.url)) { 
       response.config.url = '404.html'; 
       return $injector.get('$http')(response.config); 
      } 
      return $q.reject(response); 
     } 
    }; 
}); 

app.config(function($httpProvider) { 
    $httpProvider.interceptors.push('template404Interceptor'); 
}); 

डेमो:http://plnkr.co/edit/uCpnT5n0PkWO53PVQmvR?p=preview

Answer 2

$http सेवा के साथ किए गए सभी अनुरोधों की निगरानी के लिए आप interceptor बना सकते हैं और किसी भी प्रतिक्रिया त्रुटियों को रोक सकते हैं। अगर आपको किसी भी अनुरोध के लिए स्थिति 404 मिलती है, तो बस उपयोगकर्ता को त्रुटि पृष्ठ पर रीडायरेक्ट करें (template/404.html अपने मामले में)।

.factory('httpRequestInterceptor', function ($q) { 
    return { 
     'responseError': function(rejection) { 
      if(rejection.status === 404){ 
       // do something on error     
      } 

      } 
      return $q.reject(rejection); 
     } 
    }; 
}); 

आप अपने config समारोह में $httpProvider को इंटरसेप्टर पुश करने के लिए की आवश्यकता होगी।

myApp.config(function ($httpProvider, $interpolateProvider, $routeProvider) { 
    $httpProvider.interceptors.push('httpRequestInterceptor'); 
}); 

यहाँ demo

चीयर्स है!