问题描述
我的 html 是这样的:
My html is this:
<body ng-controller="MainCtrl as ctrl" class="bodyContainer">
<div ng-repeat="stuff in ctrl.stuffies">
here
</div>
这是我的控制器:
And this is my BaseApp
:
这是我的BaseApp
:
The problem is, even though it logs an item inside self.stuffies
(when this line is run: console.log(self.stuffies);
), here
is not printed in the HTML. There doesn't seem to be anything inside ctrl.stuffies
. I tried moving console.log(self.stuffies);
outside of BaseService.fetch.stuffs(function()
and it logs undefined
. How do I get ctrl.stuffies
to be BaseService.stuffies
?
问题是,即使它在 self.stuffies
中记录了一个项目(当这一行运行时:console.log(self.stuffies);
),here
未打印在 HTML 中.ctrl.stuffies
里面似乎没有任何东西.我尝试将 console.log(self.stuffies);
移到 BaseService.fetch.stuffs(function()
之外,它记录了 undefined
.如何我如何让 ctrl.stuffies
成为 BaseService.stuffies
?
推荐答案
$http 服务无需使用回调,因为它返回 promise:
//.factory("BaseService", ["$http", "$window", function($http, $window) {app.service("BaseService", ["$http", "$window", function($http, $window) { //var self = this; /* All functions which call fetch should have a callback function * on the front-end which sets * 1) a variable (i.e. stuffies etc.) * 2) and BaseService.cerrorMessages. */ this.fetch = { stuff: function() { //vvvv RETURN the promise return $http.get("/stuffs/") .then(function(response) { //vvvv RETURN the data return response.data; //self.stuffies = response.data; //callback(); });//, function(response) { // self.accessErrors(response.data); // callback(); //}); } };});
There is no need to do anything with $http errors in the service. Errors will be carried forward automatically in the promise.
不需要对服务中的 $http 错误做任何事情.错误会在承诺中自动结转.
Then in the controller extract the data (or the error) from the promise:
然后在控制器中从承诺中提取数据(或错误):
/* REPLACEBaseService.fetch.stuffs(function() { self.stuffies = BaseService.stuffies; console.log(self.stuffies); self.cerrorMessages = BaseService.cerrorMessages;});*/BaseService.fetch.stuffs .then(function(data) { self.stuffies = data; console.log(self.stuffies);}).catch(function(errorResponse) { self.cerrorMessages = errorResponse.data;});
For more information, see
有关更多信息,请参阅
我将您的服务更改为工厂 并以这种方式使用它:
BaseService.fetch.stuffs()
.then(function(data) {
self.stuffs = data;
console.log(self.stuffs);
}).catch(function(errorResponse) {
self.cerrorMessages = errorResponse.data;
});
这样可以吗(使用工厂是因为工厂内部还有其他功能,我不想将它们全部更改为服务)?
Is this fine (using factory because there are other functions inside the factory as well and I don't want to have to change them all to services)?
对不起,工厂是
self.fetch = {
stuffs: function() {
return $http.get("/stuffs/")
.then(function(response) {
return response.data;
});
}
};
服务或工厂都可以.对于服务,可以通过向自动返回的 this
上下文添加属性来添加函数(除非被 return
语句覆盖).对于工厂,return
语句是强制性的.函数被添加到返回的对象中.选择是风格问题.它们的用法相同.
Either a service or a factory will work. With a service, functions can be added by adding properties to the this
context which is automatically returned (unless overridden with a return
statement). With a factory, a return
statement is manditory. Functions are added to the object returned. The choice is a question of style. They are both used the same way.
这篇关于将变量从工厂分配给控件不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!