我有一个用于存储一些应用程序公共数据的服务。此服务还可以修改此数据并对事件做出反应。但是,我将更改传播到使用此服务的控制器时遇到问题。
我已经看到了这个question和question,但解决方案对我不起作用。
我创建了一个plunker,显示了我的核心问题。有一个服务object
存储sharedObject
中的公共数据。它有一个函数updateObject
,它可以更新数据(在我的真实应用程序中,它向服务器发送请求)。该服务由主控制器使用。但是,在服务中调用updateObject
时,控制器中的数据不会更新。
为什么?这也是最佳做法,还是我做错了?
以下是代码:
app = angular.module('app', []);
app.factory('object', ['$timeout', function($timeout){
var sharedObject = {attr1: '', attr2: ''};
var updateObject = function() {
$timeout(function(){
sharedObject = {attr1: 'new value', attr2: 'update value'};
console.log('updated');
}, 1000);
}
updateObject();
return sharedObject;
}]);
app.controller('main', [
'$scope', 'object', function($scope, object) {
$scope.$watch(function(){return object}, function(obj){
console.log(obj);
$scope.object1 = obj;
}, true);
}
]);
答案 0 :(得分:1)
问题是超时回调不会更新您正在观看的对象。它用另一个对象替换它。因此观察者仍然可以看到未经修改的旧对象。
替换代码,如this updated plunker中的
sharedObject.attr1 ='new value';
sharedObject.attr2 = 'update value';
您将看到页面中的值发生变化。
答案 1 :(得分:1)
问题是您在更新方法中将sharedObject
最初指向的对象替换为另一个对象。
您的控制器仍将保留对旧对象的引用。
您需要做的是更新sharedObject
。请参阅我更新的plunkr
基本上你需要在更新方法中做这样的事情
sharedObject.attr1= 'new value';
sharedObject.attr2= 'update value';