Группировка фьючерсов с $ http callbacks

Question

Я пытаюсь расширить данные из API.

Приведем пример. API будет возвращать:

GET /group/1 
{ "id": 1, "items": [1, 2, 3] } 

GET /item/1 
{ "id": 1, "name: "Item 1" } 

Я хочу отобразить группы расширить элементы внутри:

{ 
    "id": 1, 
    "expanded_items": [ 
    { "id": 1, "name: "Item 1" }, 
    { "id": 2, "name: "Item 2" }, 
    { "id": 3, "name: "Item 3" } 
    ] 
} 

Я не могу выяснить, как обрабатывать обратные вызовы для отображения вложенных элементов:

$http.get("/group/1").then(function(result) { 
    var group = result.data; 
    group.items.map(function(itemId) { 
    $http.get("/item/" + itemid); 
    // And then... ? 
    }); 
}); 

Обратный вызов then не возвращает результат. И я не уверен, что должен заполнить массив фьючерсов из функции map. Нужно ли мне?

Answer 1

Вы можете цепи ваши запросы, используя .then() как this и вы можете использовать $q.all вместе с this.For ваш случай обещания должны быть цепочки, как показано ниже:

$http.get("/group/1").then(function(result) { 
    var group = result.data; 
    var itemPromises=group.items.map(function(itemId) { 
    return $http.get("/item/" + itemid); 
    }); 
    return $q.all(itemPromises).then(function(itemResponses){ 
    return { 
     "id":1, 
     "expandedItems":itemResponses 
     } 
    }); 
}).then(function(requiredOutput){ 
    console.log(requiredOutput); 
}); 

Answer 2

Вы должны использовать $ q сервис углового в этом случае. Поскольку $ http является асинхронным по умолчанию, поэтому он не блокирует выполнение, если данные еще не получены с сервера. Чтобы заблокировать вызов, вы должны использовать службу $ q.

Answer 3

Вы можете использовать $q.all().

Что-то вроде:

$http.get("/group/1").then(function(result) { 
    var group = result.data; 
    var itemResponses = []; 
    group.items.forEach(function(itemId) { 
    itemResponses.push($http.get("/item/" + itemid)); 
    }); 
    return $q.all(itemResponses); 
}).then(function(responseDataArray) { 
    var expandedObject = {id: 1, expanded_items: []} 
    responseDataArray.forEach(function(data) { 
    expandedObject.expanded_items(expanded_expandedObjectdata.result) 
    }); 
    return expandedObject; 
}); 

(Письменное из памяти, не уверен относительно точного синтаксиса.)