1

サービスからデータを取得するコントローラーを介してビューを更新しようとしています。何らかの理由で、サービスのデータが変更されたときにビューが更新されません。ここで私のアプリケーションから例を抽出しました。私はあらゆる種類のバインディングを試しました（$scope.time = TimerService.value、関数にラップされ、使用して$watch- 成功しませんでした）。

私の元のアプリでは、これはオブジェクトの配列であり、オブジェクトの属性が変更されることに注意してください。

-- script.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 要求など) で変更されます。これは、ダイジェスト サイクルが開始されていないことを意味します。コードを use に変更する$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 に答える