Xiduzo
Xiduzo

Reputation: 1311

Angular (1.5.1) view value not updating

I'm trying to update a value in my view with angular 1.5.1 but I can't seem to get it working.

HTML:

<section>
  {{ main.state }}
</section>

controller:

vm.state = 'Scanning face';
test_facial_recognition_score();

function test_facial_recognition_score() {
  var score = vm.webgazer.getTracker().clm.getScore();
  console.log('score: ' + score);
  vm.state = 'Facial detection score: ' + score * 100;
  if(score >= 0.90) {
    recognize_facial_points();
  } else {
    setTimeout(function () {
      test_facial_recognition_score();
    }, 100);
  }
}

The initial vm.state value is showing correct in my view, also the function test_facial_recognition_score is working correct.

console:

main.controller.js:25 score: 0.2973043774479575
main.controller.js:25 score: 0.7672696234331723
main.controller.js:25 score: 0.7830798892627874
main.controller.js:25 score: 0.8757129516231377
main.controller.js:25 score: 0.9066341994265908

My question: how come the view value ({{ main.state }}) won't update the vm.state value??

Edit 1: {{ main.state }} is called so because of the stateprovider:

$stateProvider
      .state('home', {
        url: '/',
        templateUrl: 'app/main/main.html',
        controller: 'MainController',
        controllerAs: 'main'
      });

Upvotes: 0

Views: 99

Answers (1)

tymeJV
tymeJV

Reputation: 104785

setTimeout doesn't trigger a $digest cycle - use Angulars own $timeout service:

$timeout(test_facial_recognition_score, 100);

Upvotes: 1

Related Questions