angularjs - 如何等待在 angularJS 中获取异步数据？

Question

我有一个填充视图数据的服务。视图数据依赖于从数据库中获取的数据，需要等待数据加载完成。

例如：

services.factory('viewService', function (serviceX) {
    var generateView = function (s) {
        var data=[];
        var viewData=[];
        serviceX.getData().then(function (d) {
            data=d;
        });
        console.log("data:"+d);
        for(x in data){
            viewData[x]=data[x].view;
            ....
        }
        return viewData;
    };
    return{
        generateView: generateView
    }
});

serviceX.getData()已经使用该模式promise。该行for(x in data){需要该数据来生成viewData.

Answer 1

你应该使用 promise 来分离关注点：

angular.module('myModule', [])

.factory('Table', function($resource, $q) {
  return {
    data: function() {
      edsql = edsql || '';
      var deferred = $q.defer();
      $resource('my-resource-url').get({}, function(r) {
        deferred.resolve(r);
      }, deferred.reject);

      return deferred.promise;
    }
  };
});

并在您的控制器中按如下方式使用它：

$scope.data = Table.data();

Answer 2

您可以将其绑定到您的范围变量。AngularJS 会自动等待数据然后开始渲染。当然，您需要先修改从回调函数中获取的数据，然后再将其设置到作用域上。

在您的情况下，这意味着您的服务的 generateView 方法需要返回一个您可以在范围变量上设置的承诺。

Answer 3

另一种方法是使用 deferred & promise。

更多信息在这里：http ://docs.angularjs.org/api/ng .$q