1

我正在尝试通过从服务获取数据的控制器更新视图。出于某种原因，当服务的数据更改时，视图不会更新。我从我的应用程序中提取了一个示例。我已经尝试了各种绑定（$scope.time = TimerService.value，包装在一个函数中，使用$watch- 没有成功）。

请注意，在我的原始应用程序中，这是一个对象数组，并且对象的属性发生了变化。

-- 脚本.js --

var mod = angular.module('mymodule', []);

mod.service('TimerService', function() {
  this.value = 0;
  var self = this;
  setInterval(function() {
    self.value += 1;
  }, 2000)
});

mod.controller('TimerCtrl', ['TimerService', '$scope', function(TimerService, $scope) {
  $scope.time = TimerService.value;
  $scope.$watch(function() {
    return TimerService.value;
  }, function(newValue) {
    $scope.time = newValue;  
  }, true);
  $scope.otherValue = '12345';
}]);


angular.element(document).ready(function() {
  alert('start');
  angular.bootstrap(document, ['mymodule']);
});

-- index.html --

<!DOCTYPE html>
<html>

  <head>
    <script src="./angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
      <div ng-controller="TimerCtrl">
          <h1>- {{ time }}-</h1>
          <h2>{{ otherValue }}</h2>
      </div>
  </body>

</html>
4

3 回答 3

1

经过一段时间的反复试验，我终于找到了问题的答案。在我上面的示例（以及我的实际应用程序）中，数据在角度范围之外发生了变化（控制器按钮单击、http 请求等），这意味着摘要周期没有开始。如果我将代码更改为使用$timeout()，它可以工作。不幸的是，这并不能完全解决我在角度之外更改数据的问题（我想我也需要将其余部分整合到角度中）。

更新

我设法通过rootscope在我的服务中使用来执行角度之外的更改：

$rootscope.$apply(function() {
  // perform variable update here.
  self.value += 1;
});

这成功地传播到视图。

于 2013-10-16T02:53:49.340 回答
0

尝试这个

$scope.time = TimerService.value;
if(!$scope.$$phase) {
    $scope.$apply();
}
于 2013-10-15T09:18:04.220 回答
0

尝试

var app = angular.module('myApp', []);
            var value = 0;
            var timer = setInterval('Repeater()', 1000);
            var Repeater = function () {
                value++;
                var scope = angular.element(document.getElementById('myApp')).scope();
                console.log(scope);
                scope.$apply(function () {
                        scope.time = value;
                    });
                };
            app.controller('TimerCtrl', ['$scope', function( $scope) {

          }]);

归功于https://stackoverflow.com/a/16520050/356380

于 2013-10-15T12:53:03.093 回答