Делать несколько запросов из массива объектов и расширять данные с помощью Angular

0

Скажем, у меня есть множество книг, которые я получаю от конечной точки, например /api/books.

[{
  name: 'Book 1',
  id: 1
}, {
  name: 'Book 2',
  id: 2
}, {
  name: 'Book 3',
  id: 3
}]

У меня есть BookService, который извлекает категории для отдельной книги. Например, это делает запрос в /api/book/:id/categories.

BookService

function BookService($resource) {
  var service = $resource('/api/books', {}, {
    getAll: {
      method: 'GET'
    },
    getCategories: {
      url: '/api/book/:id/categories',
      method: 'GET',
      isArray: true
    },
  });

  return {
    getAll: getAll,
    getCategories: getCategories
  };
}

На моем маршруте у меня есть решение (используя ui-router), который сначала получает все книги и вводится в BookCtrl:

resolve: {
  books: ['BookService', function(BookService) {
    return BookService.getAll();
  }]
}

В моем примере контроллера я хочу увеличить результат решения books с каждой категорией книг. Так, например, я хочу, чтобы для моего контроллера были следующие books:

[{
  name: 'Book 1',
  id: 1,
  categories: ['adult', 'horror']
}, {
  name: 'Book 2',
  id: 2,
  categories: ['scifi']
}, {
  name: 'Book 3',
  id: 3,
  categories: ['comedy']
}]

Как я могу создать дополнительное решение (или использовать уже существующее) для этого?

resolve: {
  books: ['BookService', function(BookService) {
    return BookService.getAll();
  }],
  bookCategories: ['BookService', 'books', function(BookService, books) {
    // this doesnt work 
    _.each(books, function(book) {
      BookService.getCategories(book.id)
        .then(function(categories) {
          book.categories = categories;
        })
    });
    // how do i return this to the controller properly?
  }],
}

function BookCtrl(books, bookCategories) {
  // maybe somsething like this?
  var booksWithCategories = _.extend(books, bookCategories);
}
  • 0
    Не думай слишком усердно. Просто сделайте так, чтобы ваш API возвращал нужные данные за 1 вызов, а не вызывал службу в цикле.
Теги:
angular-ui-router
angular-services

1 ответ

0
resolve: {
  books: ['BookService', function(BookService) {
    return BookService.getAll();
  }],
  bookCategories: ['$q', 'BookService', 'books', function($q, BookService, books) {
    var promises = [];
    _.each(books, function(book) {
      promises.push(BookService.getCategories(book.id)
        .then(function(categories) {
          book.categories = categories;
        }));
    });
    return $q.all(promises);
  }],
}
  • 0
    Хм, похоже, не работает для меня. Только что получил массив undefined
  • 0
    Я предполагаю, что BookService.getCategories возвращает обещание (очевидно, у него есть метод .then ?)

Ещё вопросы

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