我有一个Angular应用程序,我想处理404的API终点。关键组件如下所示:
// 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,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; },} });
问题是我收到ReferenceError的错误:promise没有被定义为响应。这是因为关注服务违背承诺吗?我该怎么处理这个?
任何帮助非常感谢。
所以我的解决方案使用新的拦截器语法如下:
// interceptors.js .factory('httpRequestInterceptor',$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,$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>
这是一个简化版本,但演示了我如何使用拦截器模式来解决我的问题。
欢迎评论。