javascript - AngularJS 等待 $resource 响应设置值

Question

这是我的问题:

我有一个用 $resource 创建的服务和一个 Controller ； Controller 调用服务，我尝试在收到响应(实际上是错误)后设置一个值。问题是:我试图在回调之外设置该值。这是服务:

app.factory("DataService", function ($resource, ENV) {
    return $resource(ENV.apiEndpoint + "/endpoint/:id", {id:'@id'}, {
        update: { method: 'PUT' }
    });
});

这是一个简单的服务，通过 REST 端点从后端检索数据。

这是 Controller :

app.controller("DataController", function (DataService){
    var ctrl = this;
    ctrl.initialData = undefined;
    ctrl.data = undefined;

    ctrl.initData = function () {
        ctrl.getData();
        ctrl.data = ctrl.initialData;
    };

    ctrl.getData = function () {
        DataService.get({},
            function (response) {
                ctrl.initialData = response.content;
        }, function (error) {
                ctrl.initialData = { data1: "A" };
        });
    };
});

Angular $resource Doc说要这样调用 get() 方法:

The action methods on the class object or instance object can be invoked with the following parameters:

HTTP GET "class" actions: Resource.action([parameters], [success], [error])

由于我的后端尚未实现，因此在调试时，我正确地执行了错误回调函数。但我可以看到我的数据变量仍未定义。

我的问题是我仍然不太习惯 promise 。我知道来自 DataService 的响应是异步的。所以我尝试以几种不同的方式设置数据，但都没有成功。我试过:

• 将 initData 方法替换为:

  ctrl.initData = function () {
      ctrl.getData().then(function () {
          ctrl.data = ctrl.initialData;
      }).catch(function () {
          ctrl.data = ctrl.initialData;
      });
  };
  

  但我从来没有进入'catch'条件；

• 要使用 $q 服务:

  ctrl.initData = function () {
      $q.all([ctrl.getData()]).then(function () {
          ctrl.data = ctrl.initialData;
      });
  };
  

• 使用 $q.when 从变量 ctrl.data 创建 promise :

  ctrl.billingInfo = $q.when(/*???*/);
  

• 那些的其他变体..

我可以通过直接在回调函数中设置 data 来让它工作，但这意味着我每次调用 getData() 方法时都会重置数据，而且出于最佳实践目的，我想避免的事情:

ctrl.getData = function () {
    DataService.get({},
        function (response) {
            ctrl.initialData = response.content;
            ctrl.data = ctrl.initialData;
    }, function (error) {
            ctrl.initialData = { data1: "A" };
            ctrl.data = ctrl.initialData;
    });
};

有没有办法在设置ctrl.data之前等待ctrl.initialData被设置？

非常感谢任何一点帮助

Answer 1

你可以稍微修改一下 getData 函数来返回 promise

ctrl.getData = function() {
    return DataService.get({}).$promise.then(
        function(response) {
            return ctrl.initialData = response.content;
        },
        function(error) {
          return ctrl.initialData = { data1: "A" };
        });
};

然后你可以像then一样使用它

ctrl.initData = function () {
    ctrl.getData().then(function(initialData){
        //success callback
        ctrl.data = initialData;
    },function(initialData){
        //error callback
        ctrl.data = initialData;
    });
};