CODEWITHSUNDEEP
javascriptangularjshtml
Chait
Chait

Reputation: 501

Value not updating on the HTML using Angular

I have a controller in which a value gets randomly generated 

app.controller('detailReadingCtrl',function(){
  var value = 0;
  $scope.dispValue = 0;

 setInterval(function(){
   value = Math.floor(Math.random()*1000);
   $scope.dispValue = value;
 }
});

and my html is 

<div>{{dispValue}}</div>

The Value on the html is not getting updated with the changed value. The dispvalue is changing in the controller but it is not updating in the html. I want to see the value change for every second on the screen without the need of refresh.

I tried using $scope.$watch and also $scope.$broadcast both seem to not work. Please let me know if you have any ideas about this.

Upvotes: 1

Views: 393

Answers (1)

tymeJV
tymeJV

Reputation: 104775

setInterval doesn't trigger a $digest cycle, instead, use the $interval module:

app.controller('detailReadingCtrl',function($scope, $interval){
    var value = 0;
    $scope.dispValue = 0;

    $interval(function(){
        value = Math.floor(Math.random()*1000);
        $scope.dispValue = value;
    });
});

And you had other errors in the code ($scope wasn't being injected, missing ) at the end of the interval)

Upvotes: 3

Related Questions