我正在创建一个角度很好的Web应用程序,主要是使用远程json对象的数据驱动的。我想加载具有合理默认数据的页面,然后请求json对象并使用这些新数据更新控制器。
以下是我所提供服务的摘录:
clickApp.factory('client', ['$http', function($http){
var logoUrl = "first";
var getConfig = function() {
logoUrl = "second";
$http({method: 'GET', url: base_url+'app-config.json'}).
success(function(data, status) {
// this callback will be called asynchronously
// when the response is available
// console.log("data",data);
console.log("logopre",logoUrl);
logoUrl = "third";
console.log("logopost",logoUrl);
}).
error(function(data, status) {
console.log("error",status);
// called asynchronously if an error occurs
// or server returns response with an error status.
});
};
getConfig();
return {
logoUrl: logoUrl
}
}]);
我有一个连接到此的控制器,暂时只用logoUrl填充p标签。使用此代码,p标记立即更新为“秒”,“logopre”的日志值为“秒”,“logopost”的日志值为“第三”,但控制器不像我期望的那样将p标签更新为“第三”。
我在我的控制器中尝试了一些花哨的$ scope。$ watch语句,但这并没有改变结果。
编辑我应该注意到我在$ http请求之后也尝试了$ rootScope。$ apply但我只能得到“$ digest in progress”错误。
如何正确更新此值,以便在$ http请求后反映在我的控制器中?
答案 0 :(得分:1)
尝试这样的事情(http://plnkr.co/edit/Fnrgo4?p=preview):
app.controller('MainCtrl', function($scope, client) {
$scope.client = client;
$scope.$watch(function() {
return client;
}, function(client) {
$scope.logoUrl = client.logoUrl;
}, true);
});
app.factory('client', function($http, $log, $timeout) {
var obj = {
logoUrl: "first"
};
$log.info("logoinit", obj);
var getConfig = function() {
obj.logoUrl = "second";
$http({
method: 'GET',
url: 'app-config.json'
}).
success(function(data, status) {
$log.info("logopre", obj);
obj.logoUrl = "third";
$log.info("logopost", obj);
}).
error(function(data, status) {
$log.error("error", status);
});
};
getConfig();
return obj;
});