Javascript 动态$http GET方法为多个变量分配不同的数据

我正在尝试创建一个get函数，该函数将为api中需要的变量提供一个动态URL。我正在将$scope变量分配给返回的数据，但是我无法访问它。我将该变量记录在控制台日志中，它返回未定义的。下面是我的代码

app.controller('Controller', function ($scope, $http) {

  var getRequest = function (url) {
    $http({
            method: 'GET',
            dataType: "json",
            url: url
        }).then(function (response) {
            console.log(response);
            return response;
        }),
        function error(err) {
            console.log("This ain't working..." + err);
        }
}

$scope.firstURL = getRequest('https://url1');
$scope.secondURL = getRequest('https://url2');

---

getRequest

没有

return

语句，这就是它返回

undefined

的原因。另外，

然后

回调被异步调用。如果要将服务器响应分配给$scope vars，应在回调内执行此操作：

var getRequest = function (url) {
    return $http({
            method: 'GET',
            dataType: "json",
            url: url
        });
}

getRequest('https://url1').then(function (response) {
    $scope.firstURL = response;
}));
getRequest('https://url2').then(function (response) {
    $scope.secondUrl = response;
}));

---

getRequest

没有

return

语句，这就是它返回

undefined

的原因。另外，

然后

回调被异步调用。如果要将服务器响应分配给$scope vars，应在回调内执行此操作：

var getRequest = function (url) {
    return $http({
            method: 'GET',
            dataType: "json",
            url: url
        });
}

getRequest('https://url1').then(function (response) {
    $scope.firstURL = response;
}));
getRequest('https://url2').then(function (response) {
    $scope.secondUrl = response;
}));

正如您从中看到的，通过以下几点，您可以实现您所需要的

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

angular.module('myApp')
       .controller('MyController', MyController);

MyController.$inject = ['$http', '$log'];

function MyController($http, $log){

  var vm = this;

  vm.nick1 = 'AndreaM16';
  vm.nick2 = 'Aspha9';
  vm.gitUrl = 'https://api.github.com/users';

  vm.data1 = '';
  vm.data2 = '';

  getSomeData(vm.gitUrl + '/' + vm.nick1).then(function(res){
    vm.data1 = res.data;
    $log.log(vm.data1);
  });

  getSomeData(vm.gitUrl + '/' + vm.nick2).then(function(res){
    vm.data1 = res.data;
    $log.log(vm.data2);
  });

  function getSomeData(url){
    return $http({
                    method: 'GET',
                    dataType: "json",
                    url: url
    });
  }


}

正如@Alina Loi所说，调用的异步性质迫使您使用

获取响应。然后（）

从中可以看出，您可以通过以下操作实现所需的功能

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

angular.module('myApp')
       .controller('MyController', MyController);

MyController.$inject = ['$http', '$log'];

function MyController($http, $log){

  var vm = this;

  vm.nick1 = 'AndreaM16';
  vm.nick2 = 'Aspha9';
  vm.gitUrl = 'https://api.github.com/users';

  vm.data1 = '';
  vm.data2 = '';

  getSomeData(vm.gitUrl + '/' + vm.nick1).then(function(res){
    vm.data1 = res.data;
    $log.log(vm.data1);
  });

  getSomeData(vm.gitUrl + '/' + vm.nick2).then(function(res){
    vm.data1 = res.data;
    $log.log(vm.data2);
  });

  function getSomeData(url){
    return $http({
                    method: 'GET',
                    dataType: "json",
                    url: url
    });
  }


}

---

---

正如@Alina Loi所说，调用的异步性质迫使您使用

.then（）

添加这一行$scope.firstURL=response；在.then回调函数中。@Thangadurai然后id需要对每个变量有多个get请求。我需要第二个get请求$scope.secondURL=response。我试图对多个变量重复使用一个get请求。@William.Doyle然后将其移动到服务/工厂层，并根据需要使用它。下面有一个例子，app.factory（'myService'，function（$http）{return{async:function（）{return$http.get（'test.json'）；//1.this返回promise}；}）；您将返回整个$http响应；您可能需要

response.data

。添加此行$scope.firstURL=response的可能重复项；在.then回调函数中。@Thangadurai然后id需要对每个变量有多个get请求。我需要第二个get请求$scope.secondURL=response。我试图对多个变量重复使用一个get请求。@William.Doyle然后将其移动到服务/工厂层，并根据需要使用它。下面有一个例子，app.factory（'myService'，function（$http）{return{async:function（）{return$http.get（'test.json'）；//1.this返回promise}；}）；您将返回整个$http响应；您可能需要

响应。数据

。可能重复感谢您这类陌生人，这正是我弄错的地方。异步承诺的内容有点难以理解，但感谢您的帮助。这也可以用于POST和PUT请求吗？是的，当然；这应该适用于所有承诺。如果您有任何问题，请告诉我。对于PUT和POST请求，我如何知道请求已成功？当前，当使用post方法POSTRESQUEST（'url'，data）时，我收到一个错误“无法读取属性'then”。（函数（响应）{console.log（响应）；}）@Doyle确保在

postRequest

函数中返回

$http（…）

，而不仅仅是执行它。如果没有帮助，请给我看

postRequest

。如果请求成功，将调用成功回调（然后（…）中的第一个）。否则将调用一个错误回调（第二个）。谢谢你这个好心的陌生人，这正是我弄错的地方。异步承诺的内容有点难以理解，但感谢您的帮助。这也可以用于POST和PUT请求吗？是的，当然；这应该适用于所有承诺。如果您有任何问题，请告诉我。对于PUT和POST请求，我如何知道请求已成功？当前，当使用post方法POSTRESQUEST（'url'，data）时，我收到一个错误“无法读取属性'then”。（函数（响应）{console.log（响应）；}）@Doyle确保在

postRequest

函数中返回

$http（…）

，而不仅仅是执行它。如果没有帮助，请给我看

postRequest

。如果请求成功，将调用成功回调（然后（…）中的第一个）。否则将调用错误回调（第二个）。