Question

///Returning JSON 1
$http.get("url1").
   then(function (response) {
       $scope.foo = response.data;
});

///Returning JSON 2
$http.get("url2").
   then(function (response) {
       $scope.foo = response.data;
});

///Returning JSON (n)
$http.get("n").
   then(function (response) {
       $scope.foo = response.data;
});

我可以以某种方式将这些JSON对象连接成一个吗？原因是我有很多数据，因为我想显示很多数据供用户过滤，而不是让他们在SPA中点击1000页，我想加入他们，如果那样的话可能的（以合理的方式）。

修改

我在想这样的事情

var url ="";

for (... i < 100...) {
    url = "http://url.com"+i+"";
    $http.get(url).
        then(function(response){
           $scope.foo.concat(response.data);
           }
        );
}

更新

我设法将JSON返回加入到一个对象数组中。但问题是这个数组现在包含的对象本身包含一个对象，该对象本身包含一个对象数组......是的！

Answer 1

如果它是阵列，那么你可以连接它。

首先初始化空数组

$scope.foo = [];

$http.get("url1").
   then(function (response) {
       $scope.foo.concat(response.data);
});

Answer 2

使用$q.all创建一个返回数组的promise：

function arrayPromise(url, max)
    var urlArray = [];
    for (let i=0; i<max; i++) {
        urlArray.push(url + i);
    };
    var promiseArray = [];
    for (let i=0; i<urlArray.length; i++) {
        promiseArray.push($http.get(urlArray[i]);
    };
    return $q.all(promiseArray);
});

要获取嵌套数组，请从父级链接：

function nestedPromise (url, max) {
    var p1 = arrayPromise(url + "item/", max);

    var p2 = p1.then(function(itemArray) {
        var promises = [];
        for (let i=0; i<itemArray.length; i++) {
            var subUrl = url + "item/" + i + "/subItem/";
            promises[i] = arrayPromise(subUrl, itemArray[i].length);
        };
        return $q.all(promises);
    });
    return p2;
};

最后解决嵌套的承诺：

nestedPromise("https://example.com/", 10)
  .then(function (nestedArray) {
    $scope.data = nestedArray;
});

在层次结构的所有级别使用return语句非常重要：在.then方法和函数本身中。

链接承诺

因为调用promise的.then方法会返回一个新的派生promise，所以很容易创建一个promise链。

可以创建任意长度的链，并且由于可以使用另一个承诺来解决承诺（这将进一步推迟其解析），因此可以在任何点暂停/推迟承诺的解析。链。这使得实现强大的API成为可能。

— AngularJS $q Service API Reference - Chaining Promises

Answer 3

您可以等待n个请求完成，然后对返回的对象执行任何操作。

$q.all($http.get("url1"), $http.get("url2"), $http.get("url3"))
  .then(function (responses) { 
  // This function is called when the three requests return.
  // responses is an array with the first item being the result of
  // fetching url1, the second fetching url2, etc.

  // Depending on what the response looks like you may want to do
  // something like:

  $scope.data = angular.merge(responses[0], responses[1] /* etc */);
});

如何使用嵌套资源从不同的URL连接JSON对象

3 个答案:

链接承诺