javascript - 如何从 Angular 不同的 url 的单个 $http 调用中获得不同的响应？

Question

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

> 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;
>                 });
>               }
>             }
>       });

Plunker

Answer 1

问题是，当你的http回调被执行时，val是undefined，因为你的循环已经完成了。您需要通过为 val 创建新范围来保留 http 调用 block 中的 val。例如，您可以使用闭包:

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