Angular - несколько запросов $ http.get для данных

0

Каков наилучший подход при выполнении нескольких вызовов 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.

Хотя это работает, я чувствую, что есть, вероятно, более элегантное решение.

Любые мысли, как всегда, очень ценятся.

  • 0
    Вы можете использовать q.all () , так как он принимает массив обещаний, которые будут разрешены только после разрешения всех обещаний. Смотрите этот ответ
Теги:

3 ответа

2
Лучший ответ

Вы можете использовать q.all(), поскольку он принимает массив обещаний, который будет разрешен только тогда, когда все обещания будут разрешены.

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

Если вы посмотрите на ссылку, q.All() находится в самом низу страницы

Поделиться
  • 0
    Марк, почему он должен включать в себя целую внешнюю библиотеку q, а не использовать собственную угловую $ q? Вы не думаете, что он должен использовать версию Angular?
  • 0
    @ChrisL Где вы видите, что я говорю OP загрузить внешнюю библиотеку?
Показать ещё 5 комментариев
1

Я считаю, что вы ищете услугу $ 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';
});
}

Кредит: Код бесстыдно украден у неизвестного создателя скрипки.

Поделиться
0

Если он загружает looku pdata для всех выпадающих списков, я бы сделал один звонок, чтобы получить все данные поиска в одной полезной нагрузке. Что-то вроде этого. Каждое значение свойства представляет собой массив элементов для каждого раскрывающегося списка.

{
    "eventMethods": [
        {
            "name": "In Person",
            "id": 1
        },
        {
            "name": "Phone",
            "id": 2
        }
    ],
    "statuses": [
        {
            "name": "Cancelled",
            "id": 42
        },
        {
            "name": "Complete",
            "id": 41
        }
    ]
}
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню