AngularJS 等待 $resource 响应设置值
AngularJS wait for $resource response to set value
这是我的问题:
我有一个用 $resource 创建的服务和一个控制器;控制器调用服务,我尝试在收到响应(实际上是错误)后设置一个值。问题是:我试图在回调之外设置该值。这是服务:
app.factory("DataService", function ($resource, ENV) {
return $resource(ENV.apiEndpoint + "/endpoint/:id", {id:'@id'}, {
update: { method: 'PUT' }
});
});
这是一项通过 REST 端点从后端检索数据的简单服务。
这是控制器:
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])
由于我的后端还没有实现,在调试时,我正确地通过了错误回调函数。但是我可以看到我的数据变量仍然未定义。
我的问题是我仍然不太习惯承诺。我知道来自 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
创建承诺:
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
设置好?
非常感谢任何一点帮助
你可以稍微修复你的 getData
函数以 return 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;
});
};
这是我的问题:
我有一个用 $resource 创建的服务和一个控制器;控制器调用服务,我尝试在收到响应(实际上是错误)后设置一个值。问题是:我试图在回调之外设置该值。这是服务:
app.factory("DataService", function ($resource, ENV) {
return $resource(ENV.apiEndpoint + "/endpoint/:id", {id:'@id'}, {
update: { method: 'PUT' }
});
});
这是一项通过 REST 端点从后端检索数据的简单服务。
这是控制器:
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])
由于我的后端还没有实现,在调试时,我正确地通过了错误回调函数。但是我可以看到我的数据变量仍然未定义。
我的问题是我仍然不太习惯承诺。我知道来自 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
创建承诺: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
设置好?
非常感谢任何一点帮助
你可以稍微修复你的 getData
函数以 return 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;
});
};