角度-多个$ http.get数据请求

Question

对同一视图中需要的数据多次调用API时，最好的方法是什么？

例如，您有多个选择框，这些选择框需要包含从应用程序外部提取的数据，并且都在同一视图中。

是否有比简单地一次在控制器中将它们全部触发更好的解决方案？ 如以下

app.controller('myCtrl', function($service) { 

   $service.getDataOne().then(function(response) {
      $scope.dataOne = response;
   }, function(error) {
      console.log(error);
   });

   $service.getDataTwo().then(function(response) {
      $scope.dataTwo = response;
   }, function(error) {
      console.log(error);
   })
}); 

等等...每个服务功能执行一个$ http.get请求。

虽然这可行，但我觉得可能还有一个更优雅的解决方案。

任何想法一如既往地受到赞赏。

Answer 1

您可以使用q.all（） ，因为它接受一个仅在所有承诺均已解决后才能解决的承诺数组。

$q.all([
      $service.getDataOne(),
      $service.getDataTwo()
    ]).then(function(data){
      $scope.dataOne = data[0];
      $scope.dataTwo = data[1];
 });

如果您查看链接，则q.All()位于页面的底部

Answer 2

我相信您正在寻找$ q服务。

http://jsfiddle.net/Zenuka/pHEf9/21/

https://docs.angularjs.org/api/ng/service/ $ q

function TodoCtrl($scope, $q, $timeout) {
function createPromise(name, timeout, willSucceed) {
    $scope[name] = 'Running';
    var deferred = $q.defer();
    $timeout(function() {
        if (willSucceed) {
            $scope[name] = 'Completed';
            deferred.resolve(name);
        } else {
            $scope[name] = 'Failed';
            deferred.reject(name);
        }
    }, timeout * 1000);
    return deferred.promise;
}

// Create 5 promises
var promises = [];
var names = [];
for (var i = 1; i <= 5; i++) {
    var willSucceed = true;
    if (i == 2) willSucceed = false;
    promises.push(createPromise('Promise' + i, i, willSucceed));
}

// Wait for all promises    
$scope.Status1 = 'Waiting';
$scope.Status2 = 'Waiting';
$q.all(promises).then(
    function() { 
        $scope.Status1 = 'Done'; 
    }, 
    function() { 
        $scope.Status1 = 'Failed'; 
    }
).finally(function() {
    $scope.Status2 = 'Done waiting';
});
}

信用：从未知的小提琴创作者无耻地偷来的代码。

Answer 3

如果它用于为所有下拉菜单加载looku pdata，我将进行一次调用以将所有查找数据存储在一个有效负载中。 这样的事情。 每个属性值是每个下拉菜单项的数组。

{
    "eventMethods": [
        {
            "name": "In Person",
            "id": 1
        },
        {
            "name": "Phone",
            "id": 2
        }
    ],
    "statuses": [
        {
            "name": "Cancelled",
            "id": 42
        },
        {
            "name": "Complete",
            "id": 41
        }
    ]
}