AngularJS utilisant un intercepteur pour gérer $ http 404s - promet une erreur non définie

J'ai Angulaire de l'app, je veux gérer une erreur 404 forme d'une API point de fin. Les éléments principaux sont comme suit:

//app.js
var myApp = angular.module('myApp', ['ngRoute',]);
myApp.config( function ($httpProvider, $interpolateProvider, $routeProvider) {
$httpProvider.interceptors.push('httpRequestInterceptor');
$routeProvider
...
.when('/project/:projectId', {
templateUrl : 'partials/project_detail.tmpl.html',
controller: 'ProjectDetailCtrl',
resolve: {
project: function ($route, ConcernService) {
return ConcernService.get('projects/', $route.current.params.projectId);
},
}
});
});
//interceptors.js
myApp.factory('httpRequestInterceptor', function ($q, $location) {
return {
response: function(response){
return promise.then(
function success(response) {
return response;
},
function error(response) {
if(response.status === 404){
$location.path('/404');
return $q.reject(response);
}
else{
return $q.reject(response); 
}
}
);
}
};
});
//services.js
myApp.factory('ConcernService', function ($http, $q) {
var ConcernService = {
...
get: function (items_url, objId) {
var defer = $q.defer();
$http({method: 'GET', 
url: api_url + items_url + objId}).
success(function (data, status, headers, config) {
defer.resolve(data);
}).error(function (data, status, headers, config) {
//when API not found, status == 404 
console.log('ConcernService.get status',status);
defer.reject(status);
});
console.log('ConcernService.get promise',defer.promise);
return defer.promise;
},
}
});

Le problème est que j'obtiens une erreur de ReferenceError: promise is not defined at response. Est-ce parce que la ConcernService reporte la promise? Comment dois-je faire avec cela?

Toute aide appréciée.

source d'informationauteur Darwin Tech

  1. 33

    Donc, ma solution qui fonctionne, en utilisant la nouvelle interceptor la syntaxe est comme suit:

    //interceptors.js
.factory('httpRequestInterceptor', function ($q, $location) {
return {
'responseError': function(rejection) {
//do something on error
if(rejection.status === 404){
$location.path('/404/');                    
}
return $q.reject(rejection);
}
};
});
//app.js
myApp.config( function ($httpProvider, $interpolateProvider, $routeProvider) {
$httpProvider.interceptors.push('httpRequestInterceptor');
$routeProvider
...
.when('/404/:projectId', {
templateUrl : 'partials/404.tmpl.html',
controller: '404Ctrl',
resolve: {
project: function ($route) {
//return a dummy project, with only id populated
return {id: $route.current.params.projectId};
}
}
});
});
//404.tmpl.html
...
<h1>Oh No! 404.</h1> 
<p>Project with ID {{ project.id }} does not exist.</p>

    C'est une version simplifiée, mais montre comment j'ai utilisé le interceptor modèle pour résoudre mon problème.

    Les commentaires sont les bienvenus.

  2. 2

    Je pense que la structure de vous intercepteur peut être désactivé. J'ai posté une réponse auprès d'un échantillon de l'intercepteur ici (Poignée de réponse HTTP 302 à partir de proxy dans angularjs) que vous pourriez trouver utiles. Il fonctionne pour moi sur une base quotidienne.

  3. 0

    Est plus facile de passer le paramètre que

    <div class="fullPortfolio" ng-show="projectId.length">Project Id passed</div>

    et puis, quand l'id de projet n'est pas exister

    <div class="fullPortfolio" ng-show="!projectId.length">Project Id is not exist</div>