angularjs中的异步数据检索

Async data retrievel in angularjs

本文关键字：数据 检索 异步 angularjs      更新时间：2023-09-26

我的angularjs应用程序中存在异步问题。

我想做的是从远程服务器（在prefsService.js中）检索数据。然后将数据值分配给控制器（在prefsController.js中）中的变量。

这是prefsService.js文件：

 (function() {
  'use strict';
  angular
    .module('app')
    .factory('PrefsService', PrefsService);
  PrefsService.$inject = ['$resource','PrefsResource'];
  function PrefsService($resource,PrefsResource) {
    var initialize = function() {
      var twentyFourHourTime = null;
      var decimalTime = null;
      var startDayOfWeek = null;
      var roundingOption = null;
      var roundingIncrement = null;
      PrefsResource.get({key:"TwentyFourHourTime"}, function(data) {
        if (data.result.value === null||undefined) {
            twentyFourHourTime = 0;
        } else {
            twentyFourHourTime = data.result.value;
        }
            PrefsResource.get({key:"DecimalTime"}, function(data) {
              if (data.result.value === null||undefined) {
                  decimalTime = 0;
              } else {
                  decimalTime = data.result.value;
              }
                  PrefsResource.get({key:"startDayOfWeek"}, function(data) {
                    if (data.result.value === null||undefined) {
                        startDayOfWeek = 0;
                    } else {
                        startDayOfWeek = data.result.value;
                    }
                    return {"twentyFourHourTime":twentyFourHourTime,"decimalTime":decimalTime,"startDayOfWeek":startDayOfWeek}
              });
            });
      });

    };
    return {
      initialize: initialize
    };
  }
})();

这是prefsController.js文件：

vm.test=PrefsService.initialize();
console.log('Prefs data initialized', vm.test);

当我运行它时，vm.test总是"未定义"的。

我该怎么办？Thx！

我还没有对此进行语法检查，但与所有异步编程一样，它的要点是promise。这个问题是一个骗局（谁还能找到这类问题的主骗局？）

 (function() {
  'use strict';
  angular
    .module('app')
    .factory('PrefsService', PrefsService);
  PrefsService.$inject = ['$resource','PrefsResource'];
  function PrefsService($resource,PrefsResource) {
    var initialize = function() {
      //return a promise
      return $q
        .all([
          PrefsResource.get({key:"TwentyFourHourTime"}),
          PrefsResource.get({key:"DecimalTime"}),
          PrefsResource.get({key:"startDayOfWeek"})
        ])
        .then(function(values) {
          var 
            twentyFourHourTime = values[0],
            decimalTime = values[1],
            startDayOfWeek = values[2];
          //return the value (object) when all promises have resolved
          return {
            "twentyFourHourTime":twentyFourHourTime.result.value || 0,
            "decimalTime":decimalTime.result.value || 0,
            "startDayOfWeek":startDayOfWeek.result.value || 0
          }
        })
    }

    return {
      initialize: initialize
    };
  }
})();

PrefsService
  .initialize()
  //use the promise API to log messages only after the promise has resolved
  .then(function(prefs) {
    console.log('initialized');
    console.log(prefs);
  })
相关文章：