Использование обещаний в AngularJS для задания данных в представлении, а затем обновления представления после обработки данных в фоновом режиме

0

У меня есть проект, в котором я собираю данные из базы данных и должен выполнять итерацию по возвращенному дереву объектов, чтобы манипулировать данными, и поскольку эти манипуляции требуют много времени (много данных), это влияет на время загрузки страницы.

Исходные - необработанные данные полезны как есть, поэтому я хотел бы установить объект $ scope.data необработанными данными и затем заменить его после завершения обработки.

Я думал примерно так:

dataFactory.getAssets()
    .success(function(data) {
        $scope.assets = data; /* sets data in view */
    }
})

.then(function(data) {
    dataFactory.processAssets(data); /* post-processes data*/
    $scope.assets = data; /* sets processed data in view */
})

.error(function(data) {
    $log.log(data.error + ' ' + status);
});

Я, очевидно, что-то пропустил здесь, и любая помощь будет оценена по достоинству.

В основном я хочу это сделать:

  1. getData из базы данных
  2. установить $ scope.view = данные для отображения необработанных данных на странице
  3. отправлять данные для обработки в фоновом режиме во время просмотра страницы
  4. reset $ scope.view to = обработанные данные при завершении обработки
Теги:
angular-promise

3 ответа

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

Чтобы связать функции с обещаниями, верните данные в функции обработчика.

dataFactory.getAssets()
    .then(function onFulfilled(data) {
        $scope.assets = data; /* sets data in view */
        //return data for chaining
        return data;
    }
})

.then(function chainedHandler(chainedData) {
    var processedData = dataFactory.processAssets(chainedData);
    $scope.assets = processedData; /* sets processed data in view */
    //return for further chaining
    return processedData;
})

.catch(function onRejected(errorResult) {
    $log.log(errorResult.error + ' ' + status);
});

Обратите внимание, что .success и .error устарели, и оба игнорируют возвращаемые значения. Используйте .then и .catch методы вместо этого, особенно если вы собираетесь цепи обещаний.

Методы обещания $http legacy .success и .error устарели. Вместо этого используйте стандартный метод .then. 1

Поскольку вызов метода .then обещания возвращает новое производное обещание, легко создать цепочку обещаний. Можно создавать цепочки любой длины, и поскольку обещание может быть разрешено с помощью другого обещания (которое отложит дальнейшее его разрешение), можно приостановить/отложить разрешение обещаний в любой точке цепи. Это позволяет реализовать мощные API. 2

Для получения дополнительной информации см. Угловой порядок выполнения с помощью $q.

0

Попробуйте вот так:

dataFactory.getAssets()
  .then(function(data) {
    $scope.assets = data; /* sets data in view */
  }, function(data) {
    $log.log(data.error);
  })
  .finally(function(data) {
    dataFactory.processAssets(data).then(function(data){
      $scope.assets = data; /* post-processes data*/
    });
  });
0

dataFactory.processAssets должен вернуть обещание и сбросить представление, когда это обещание будет разрешено:

 dataFactory.getAssets().then(function(rawData){

     //get raw data and set to assets
     $scope.assets = rawData;

     //process data
     dataFactory.processAssets(rawData).then(function(data){

         //get processed data and set to assets
         $scope.assets = data
     })
 })

Ещё вопросы

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