【问题标题】:Propagating change of data in service to controller将服务中数据的更改传播到控制器
【发布时间】:2013-07-12 10:15:24
【问题描述】:

我有一项用于存储一些应用程序通用数据的服务。该服务还可以修改这些数据并对事件做出反应。但是,我无法将更改传播到使用此服务的控制器。

我见过这个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);
  }
]);

【问题讨论】:

  • 请在此处发布代码,除了 plunker。

标签: angularjs angularjs-service


【解决方案1】:

问题在于超时回调不会更新您正在观看的对象。它用另一个对象替换它。所以观察者仍然看到旧对象,未修改。

this updated plunker中的代码替换为

sharedObject.attr1 ='new value';
sharedObject.attr2 = 'update value';

您会看到页面中的值发生变化。

【讨论】:

  • 谢谢!但是有没有办法在一个分配中做到这一点?例如。如果我在这个对象上有十几个属性,我不想为每个属性都写这一行。
  • 包装实际对象 (sharedObject),将十几个字段放入另一个包含此对象作为唯一属性的字段 (watched)。永远不要替换watched,而是将另一个对象分配给watched.sharedObject
【解决方案2】:

问题是您在更新方法中将 sharedObject 最初指向的对象完全替换为另一个对象。 您的控制器仍将持有对旧对象的引用。

您需要做的是更新到位的sharedObject。查看我更新的plunkr

基本上你需要在更新方法中做这样的事情

 sharedObject.attr1= 'new value';
 sharedObject.attr2= 'update value';

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-03-23
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多