AngularJS - 监视服务更改不更新视图

时间:2016-06-06 13:28:15

标签: angularjs

我正在研究angularjs 1.4。我试图有一些前端缓存集合,在插入新数据时更新视图。我已经从Angularjs watch service object检查了其他答案,但我相信我没有覆盖数组,这意味着引用是相同的。

代码非常简单:

(function(){

  var appCtrl = function($scope, $timeout, SessionSvc){

    $scope.sessions = {};
    $scope.sessions.list = SessionSvc._cache;

    // Simulate putting data asynchronously
    setTimeout(function(){
      console.log('something more triggered');
      SessionSvc._cache.push({domain: "something more"});
    }, 2000);


    // Watch when service has been updated
    $scope.$watch(function(){
      console.log('Watching...');
      return SessionSvc._cache;
    }, function(){
      console.log('Modified');
    }, true);
  };

  var SessionSvc = function(){
    this._cache = [{domain: 'something'}];
  };

  angular.module('AppModule', [])
          .service('SessionSvc', SessionSvc)
          .controller('appCtrl', appCtrl);

})();

我认为脏检查必须在不使用任何观察者的情况下捕获更改。我仍然让观察者检查一旦触发了setTimeout函数就会执行任何操作。我只是没有看到检测到的变化。

这是jsbin。我真的不理解某事或犯了一个真正的摇滚错误。

1 个答案:

答案 0 :(得分:0)

您需要将$scope.$apply();置于超时的底部以触发更新。或者,您可以使用注射$timeout service代替setTimeout,并且会自动调用$ apply。

jsbin