$超時服務不更新範圍變量

Question

我有這個簡單的代碼在這裏，我不完全理解爲什麼服務沒有更新範圍變量。我相信這與$ scope不再指向服務內部變量的內存位置有關，但我不知道如何修復。

fooController.js

$scope.count = foo.cycleCount() 

的index.html

<div>{{count}}</div> 

fooService.js

angular.module('app').factory('foo', function($timeout){ 
    return cycleCount: function(){ 
    var count = 1; 
    $interval(function(){ 
    if (count === 5){ 
     count = 1; 
    }else{ 
     count++; 
    } 
    return count; 
    }), 2000); 
    return count; 
} 
}); 

我想不會的$ timout移動到一個解決方案控制器，最好是不使用$ watch的一個（儘管如果它必須的話）。 WITH OBJECT

EDIT RETURNED：

fooController.js

$scope.count = foo.cycleCount() 

的index.html

<div>{{count.num}}</div> 

fooService.js

angular.module('app').factory('foo', function($timeout){ 
    return cycleCount: function(){ 
    var count = {num: 1 } 
    $interval(function(){ 
    if (count.num === 5){ 
     count.num = 1; 
    }else{ 
     count.num++; 
    } 
    return count; 
    }), 2000); 
    return count; 
} 
}); 

Answer 1

您傳遞的是原語而不是對象。有兩件事你可以做：

1. 裹'計數'在一個對象，並返回對象從服務。這樣，範圍值也將被更新。
2. 強制範圍選取變更。這可以通過在服務值上使用監視或設置超時來更新它來完成。
3. 在服務中註冊並取消註冊更新功能，請參閱下面的代碼片段。

_

angular.module('app').factory('foo', function($interval, $parse){ 
    countUpdaters = {}; 

    var count = 1; 
    $interval(function(){ 
     if (count === 5){ 
      count = 1; 
     }else{ 
      count++; 
      updateValues(countUpdaters, count); 
     } 
    }), 2000); 

    var updateValues = function(updaters, value) { 
     var keys = Object.keys(updaters); 
     var values = keys.map(function(v) { return updaters[v]; }); 
     values.forEach(function(updater) { 
      $parse(updater.nameSpace)(updater.scope); 
     }); 
    }; 

    var services; 
    services = { 
     registerCountUpdater: function(scope, nameSpace) { 
      countUpdaters[scope.$id] = { 
       scope: scope, 
       nameSpace: nameSpace 
      }; 
      // Auto-unregister on scope removal 
      scope.$on('$destroy', function() { 
       services.unregisterCountUpdater(scope); 
      }); 
     }, 
     unregisterCountUpdater: function(scope) { 
      delete countUpdaters[scope.$id]; 
     } 
    }; 
    return services; 

}); 

Answer 2

的$timeout應該是：

$timeout(function(){ 
    $scope.count = foo.cycleCount() 
},0); 

視圖中的值被綁定到控制器，因此這也正是$digest週期應力。