angularjs

时间:2016-04-11 02:03:43

标签: angularjs angular-http

我正在使用本地计算机上的json文件开发我的应用程序,现在我已准备好开始在服务器上进行测试,但由于某种原因,我从$ http请求中获得了不完整的响应。

我有以下服务使用4个承诺请求所有数据:

angular
.module('myApp')
.service('ProductService',
    ['$http','$q', '$filter', '$resource' ,ProductService]);

function ProductService($http,$q,$filter) {

    var self = this;
    //Callable members of this service---------------
    self.getProducts = getProducts;
    self.getVendors = getVendors;
    self.getCategories = getCategories;
    self.getAllData = getAllData;
    self.getInventory = getInventory;
    //---------------//---------------//---------------

function getProducts() {
    var d = $q.defer();
    $http({method : 'GET', url : GET_PRODUCTS_URL})
    .then(function(response) {
        d.resolve(response.data);
    },function (error) {
        d.reject(error);
    });
    return d.promise;
}

function getVendors() {
    var d = $q.defer();
    $http({method : 'GET', url : GET_VENDORS_URL})
    .then(function(response) {
        d.resolve(response.data);
    },function (error) {
        d.reject(error);
    });
    return d.promise;
}

function getCategories() {
    var d = $q.defer();
    $http({method : 'GET', url : GET_CATEGORIES_URL})
    .then(function(response) {
        d.resolve(response.data);
    },function (error) {
        d.reject(error);
    });
    return d.promise;
}

function getInventory() {
    var d = $q.defer();
    $http({method : 'GET', url: GET_ON_HAND_URL})
    .then(function(response) {
        d.resolve(response.data);
    },function(error) {
        d.reject(error);
    });
    return d.promise;
}

function getAllData() {
    var promises = [];
    promises.push(self.getCategories());
    promises.push(self.getVendors());
    promises.push(self.getProducts());
    promises.push(self.getInventory());
    return $q.all(promises);
}
}

问题:

由于某种原因,单个http请求有时会回来不完整,我也会以某种方式得到意外的令牌错误,其中来自$ http请求部分的结束括号]被遗忘。很奇怪。我确信响应JSON是正确的。这是一个示例请求网址:

http://jadran.sdsu.edu/jadrn002/servlet/surfing/data?action=vendor

什么可能导致这种行为?

1 个答案:

答案 0 :(得分:2)

在听完评论者的建议之后,我重写了整个服务,不使用延迟,而且效果要好得多。这是新版本:

angular
    .module('myApp')
    .factory('ProductService',
        ['$q', '$filter', '$resource' ,ProductService]);

function ProductService($q,$filter, $resource) {

     return $resource(API_URL, 
         {}, { 
             products: { method: 'GET', params: { action: 'product'}, isArray: true},
             vendors: { method: 'GET', params: { action: 'vendor'}, isArray: true},
             categories: { method: 'GET', params: { action: 'category'}, isArray: true},
             inventory: { method: 'GET', params: { action: 'on_hand'}, isArray: true},
         }
     );

}

这些都包含$ promise属性,所以我可以调用以下内容:

$q.all([
  ProductService.categories().$promise,
  ProductService.vendors().$promise,
  ProductService.products().$promise,
  ProductService.inventory().$promise
  ])
.then(updateModelWithData)
.catch(function (error) {
  console.log('There was an error fetching data:');
  console.log(error);
});

我花了很长时间来解决这个问题,但我终于明白了。

作为旁注,我之前没有意识到这一点,但我在后端方面遇到问题,同时请求混淆了并且响应不正确。我现在已经解决了这两个问题。谢谢你的建议。