Question

您好我有一系列城市

var cityArr = ["London", "Beijing", "Paris", "New York", "Seoul", "HongKong"];

我想遍历每个城市并使用AngularJS和Javascript获取JSON API，这是我的代码：

for (i=0; i<cityArr.length; i++){

    $scope.$watch('fondCity', function () {
        cityService.city = $scope.foundCity;
    });
    var newUrl = "http://api.waqi.info/feed/" + cityArr[i] + "/?token=5336bd836b9ec064f6c6fe0bf7e2781838c15c87";
        $http({
            method: "GET",
            url: newUrl
        }).then(function mySucces(response) {
            $scope.newData = response.data;




        }, function myError(response) {
            $scope.newData = response.statusText;
        });
    }

如何将每个JSON文件添加到一个单独的数组中。

JSON单个文件

{
  "status": "ok",
  "data": {
    "aqi": 49,
    "idx": 5724,
    "attributions": [
      {
        "url": "http://uk-air.defra.gov.uk/",
        "name": "UK-AIR, air quality information resource - Defra, UK"
      },
      {
        "url": "http://londonair.org.uk/",
        "name": "London Air Quality Network - Environmental Research Group, King's College London"
      }
    ],
    "city": {
      "geo": [
        51.5073509,
        -0.1277583
      ],
      "name": "London",
      "url": "http://aqicn.org/city/london/"
    }
}

我希望它看起来像这样：

{
  "status": "ok",
  "data": {
    "aqi": 49,
    "idx": 5724,
    "attributions": [
      {
        "url": "http://uk-air.defra.gov.uk/",
        "name": "UK-AIR, air quality information resource - Defra, UK"
      },
      {
        "url": "http://londonair.org.uk/",
        "name": "London Air Quality Network - Environmental Research Group, King's College London"
      }
  "status": "ok",
  "data": {
    "aqi": 155,
    "idx": 1451,
    "attributions": [
      {
        "url": "http://www.bjmemc.com.cn/",
        "name": "Beijing Environmental Protection Monitoring Center (北京市环境保护监测中心)"
      },
      {
        "url": "http://beijing.usembassy-china.org.cn/070109air.html",
        "name": "U.S Embassy Beijing Air Quality Monitor (美国驻北京大使馆空气质量监测)"
      }
    ],
{
  "status": "ok",
  "data": {
    "aqi": 28,
    "idx": 5722,
    "attributions": [
      {
        "url": "http://www.airparif.asso.fr/",
        "name": "AirParif - Association de surveillance de la qualité de l'air en Île-de-France"
      }
    ],

Answer 1

由于每个响应共享相同的属性，因此您可以实现的最佳方法是获得每个响应的数组。

使用$q，您可以同时使用$http和map的承诺。

var promises = cityArr.map(function(name) {
    return $http.get("http://api.waqi.info/feed/" + name + "/?token=5336bd836b9ec064f6c6fe0bf7e2781838c15c87");
});  // For each City Name, create an array filled with Promises.

// Wait for all the Promises to be completed.
$q.all(promises).then(function(data) {
    // Create an array of the data attribute from each response.
    var results = data.map(function(result) {
        return result.data;
    });

    console.log(results);
});

您需要将$q作为依赖项添加到控制器或组件中。

我创建了一个JSBin示例：http://jsbin.com/gukusot/edit?js,console

Answer 2

JSON中的重复键定义

{
    "status": "ok",
    "status": "not ok"
}

不应该使用。

您应该将每个JSON回复包装到一个对象中，并且可以将这些对象连接到一个数组中。


    var myApp = angular.module('myApp',[]);

    function MyCtrl($scope, $http) {
    var cityArr = ["London", "Beijing", "Paris", "New York", "Seoul", "HongKong"];
    $scope.newData = {};

    angular.forEach(cityArr, function(value) {
    var newUrl = "http://api.waqi.info/feed/" + value + "/?token=5336bd836b9ec064f6c6fe0bf7e2781838c15c87";
        $http({
            method: "GET",
            url: newUrl
        }).then(function mySucces(response) {
            $scope.newData[value] = response.data;
            console.log($scope.newData);
        }, function myError(response) {
            $scope.newData[value] = response.statusText;
        });
    });
}

期望的结果：


    [
    "London": {"status": "ok", ...},
    "Beijing": {"status": ... , ... },
    ...
    ]

注意：

不要污染全局范围，对循环变量使用 var 关键字。
我更喜欢使用内置函数迭代数组，例如angular.forEach。

从多个JSON文件创建一个数组

2 个答案: