Javascript 如何使用不同的url从单个$http调用中获得不同的响应？

我的应用程序中有两个不同的url。我只想得到两个不同的响应，并将其分配给两个不同的对象。下面是代码

> angular.module('App',[]).controller('Ctr',function($scope,http){
>         var urls = {
>               "data11":"data1.json",
>               "data22":"data2.json"
>         };
>         for(var val in urls){
>           console.log(urls[val]);
>           http.getData(urls[val]).then(function(resp){
>             $scope[val] = resp;
>           });
>         }
>         console.log($scope);
>             
>       }).factory('http',function($http){
>             return{
>               getData:function(url){
>                 console.log("url",url);
>                 return $http.get(url).then(function(resp){
>                   return resp;
>                 });
>               }
>             }
>       });

---

问题是，当执行http回调时，

val

是

undefined

，因为循环已经完成。您需要通过为

val

创建新的作用域，在http调用的块中保留

val

。例如，您可以使用闭包：

for(var val in urls) {
   (function() { 
     var newVal = val;
     http.getData(urls[newVal]).then(function(resp){
       $scope[newVal] = resp;
     });
   })();
 }

---

使您的API在一个请求中返回所有数据，如果您是从同一服务器请求数据，这会更好。因此，您的响应将类似于Ex:

{users:[]，categories:[]}