CODEWITHSUNDEEP
angularjs
dndr
dndr

Reputation: 2359

Monitor global variable from AngularJS

I want to constantly monitor the value of a global variable from Angular. I have a flash movie which records microphone data and pushes this out to the global variable. I reference this variable from Angular like this:

$scope.audioData = $window.audioData;
$scope.$watch('audioData', function() {
    console.log("audio in angular!:", $scope.audioData.length);
});

and in the HTML I've put:

<h1>{{audioData.length}}</h1>

In the HTML I can see that the audio data is changed after I recorded, but the watch function is not being called while it's recording, which I need to stream the audio to a server.

Upvotes: 1

Views: 2575

Answers (1)

Supr
Supr

Reputation: 19022

There are two things to keep in mind here.

The first is that $watch by default only watches the identity of objects and array, so it doesn't notice if there are changes inside the value. This can be solved by watching the length or using the third argument as Yoshi has mentioned.

The second thing to remember is that Angular will only check its watches when something triggers it. If nothing is happening in Angular-world, then no watches or callbacks will be executed. Since your recorder lives outside of the Angular-world, it needs to notify Angular that something has been changed. This can be done by calling $apply occasionally after updating the recording. An alternate way to consider is to just have Angular update at regular intervals by using $timeout.

Upvotes: 2

Related Questions