AngularJS : 기본 $ 시계가 작동하지 않습니다.

Question

AngularJS에서 시계를 설정하려고하는데 분명히 잘못된 일을하고 있지만 잘 모르겠습니다. 즉각적인 페이지로드시 시계가 작동하지만 시청 한 값을 변경하면 작동하지 않습니다. 기록을 위해 익명 함수를 사용하여 감시 변수를 반환하도록 설정했는데 동일한 결과가 나타납니다.

컨트롤러의 모든 작업을 수행하면서 아래의 최소한의 예제를 작성했습니다. 차이가 나는 경우 실제 코드가 지시문에 연결되지만 두 방법 모두 동일한 방식으로 실패합니다. 내가 누락 된 기본적인 것이 있어야한다는 느낌이 들지만, 나는 그것을 보지 못한다.

HTML :

<div ng-app="testApp"> 
    <div ng-controller="testCtrl"> 
    </div> 
</div> 

JS :

var app = angular.module('testApp', []); 

function testCtrl($scope) { 
    $scope.hello = 0; 

    var t = setTimeout(function() { 
     $scope.hello++; 
     console.log($scope.hello); 
    }, 5000); 

    $scope.$watch('hello', function() { console.log('watch!'); }); 
} 

시간 초과 작업, hello 증가하지만 발생하지 않습니다 시계. 당신이 각도 모르게 값을 업데이트하기 때문에

데모 http://jsfiddle.net/pvYSu/

Answer 1

에서 그것은이다.

setTimeout 대신 $timeout 서비스를 사용해야하며이 문제에 대해 걱정할 필요가 없습니다.

function testCtrl($scope, $timeout) { 
    $scope.hello = 0; 

    var t = $timeout(function() { 
     $scope.hello++; 
     console.log($scope.hello); 
    }, 5000); 

    $scope.$watch('hello', function() { console.log('watch!'); }); 
} 

또는 $ scope()를 호출 할 수 있습니다. $ apply(); 필요하다면 각도로 값을 다시 확인하고 시계를 호출하십시오.

var t = setTimeout(function() { 
    $scope.hello++; 
    console.log($scope.hello); 
    $scope.$apply(); 
}, 5000); 

Answer 2

div가 컨트롤러에 등록되어 있지 않기 때문에 발생할 수도 있습니다. 다음과 같이 DIV에 컨트롤러를 추가하고 시계가 작동합니다 :

<div ng-controller="myController"> 

Answer 3

당신은 setTimeout``의 사용은 단지 예를 들어했다 $ 간격과 $ 제한 시간

$scope.$watch(function() { 
      return variableToWatch; 
     }, function(newVal, oldVal) { 
      if (newVal !== oldVal) { 
       //custom logic goes here...... 
      } 
     }, true);