각도 모델이 setIntervaL과 함께 작동합니까?각도 JS - 간격으로 변수 업데이트
이scope.testFunc = function(){
setInterval(function(){
scope.number--;
},1000);
};
setInterval을하지 않고 수는 매일 업데이트됩니다 :
여기에 나는 그것이하여 setInterval없이 업데이트 어떤 이유로
<p>{{number}}</p>
<button ng-click="testFunc()">TEST</button>
을 가지고 있지만, 이런 식으로하지 않는 경우 .. 예입니다 클릭하지만 setInverval을 사용하면 계속 업데이트되지 않습니다. 5 초마다 클릭하면 일련의 숫자가 점프됩니다 (배경에서는 실행되지만보기는 업데이트되지 않습니다).
은 당신이 DOM을 업데이트하지 그래서 외부 "각도의 세계"의 인 setInterval를 사용하고 있다는 점이다. 두 가지 옵션이 있습니다. 하나는 다른 옵션보다 훨씬 낫습니다.
$interval을 사용하십시오. Angular 세계의 일부분을 제외하고는 setInterval과 같으므로, 이러한 변경으로 뷰가 업데이트됩니다 (지시문에 $ interval을 전달해야 함).
scope.testFunc = function(){
$interval(function(){
scope.number--;
},1000);
};
두 번째 옵션은 다이제스트주기를 킥오프 현재 코드()를 적용 호출하는 것입니다,하지 않는 더 나은 옵션이 있기 때문에하지만. 대신 대신 값을 표시하는 <p ng-model="number"></p>를 사용해보십시오 {{ number }}를 사용하는 추가 참고로 https://docs.angularjs.org/api/ng/service/ $ 간격
:
각도에는 setInterval에 대한 멋진 래퍼가 함께 제공됩니다. 거의 같은 방식으로 사용하십시오. 무슨 일
로그 오류이 예를 참조하십시오 : 아래의 코드는 참조 $ 간격이 정의되지 않은 – pashOCONNOR
것은 주입입니다 당신의 컨트롤러? – tgeery
$ 간격은에서 그것에 대해 자세히 알아볼 수 있습니다 확실히 작동합니다.
은 $ 간격을 사용하여 시도하지만 오류를 반환 : $ 간격이 정의되어 있지 않습니다 ....하지만 $ 소화() 일 :
scope.testFunc = function(){
setInterval(function(){
scope.number--;
scope.$digest();
},1000);
};
아니요! 내 대답에서 언급 한 이유 때문에이 작업을 수행하지 마십시오. –
작동하지 않는 이유는 $ interval을 주입하지 않았기 때문입니다 – Cybrix
이 각도 JS의 간격에 대한 설명서를 참조하십시오 Interval with Angular JS
간격을 사용하여 $ digest을 사용하지 마십시오.
HTML
<div ng-app ng-controller="ApplicationController">
<pre>Number: {{ number }}</pre>
<button ng-click="testTimer()">Test Timer</button>
</div>
JS
function ApplicationController($scope,$interval) {
$scope.number = 99999;
$scope.testTimer = function() {
$interval(function() {
$scope.number--;
}, 100);
};
}
$ 간격을 사용하여 시도했지만 오류가 발생했습니다 : $ 간격이 정의되지 않았습니다. ... BUT $ digest()가 작동했습니다. – pashOCONNOR
예. myApp.controller (function ($ scope, $ interval) {...} 내가 언급 한 것처럼 컨트롤러에 $ interval을 전달해야합니다. angular.module ('myCtrl', function ($ scope, $ interval) ... –