Loose access to $scope

[Desmodue]

Hi

I have a websocket connection open and data is being sent from the server. However I cannot apply this data to the controller $scope?

angular.module('bedappApp').controller('MainCtrl', function ($scope, $websocket) {
var ws = $websocket.$new({
url: 'ws://localhost:8080'
});

$scope.message = '';
ws.$on('$open', function () {
    ws.$emit('hello', 'world'); // it sends the event 'hello' with data 'world'
});
ws.$on('$message', function (message) {
    console.log(message);
    $scope.message = message;
});
ws.$on('$close', function () {
    console.log('Got close, damn you silly wifi!');
});

$scope.$watch('message', function (change) {
    console.log('hey, myVar has changed!', change);
});

});

The watch never updates, also a simple two way binding on the html page does not update.
The console does show the data being received and printed.

Object {0: "1.308500E-01", type: "Potential", key: "0", value: "1.308500E-01", source: "temp"} scripts.a3a83e70.js:1
Object {type: "board", key: "AmbientTemperature", value: "2.238280E+01", AmbientTemperature: "2.238280E+01", source: "temp"} scripts.a3a83e70.js:1
Object {0: "2.453350E+01", type: "Temperature", key: "0", value: "2.453350E+01", source: "temp"} scripts.a3a83e70.js:1
Object {0: "8.703000E-02", type: "Potential", key: "0", value: "8.703000E-02", source: "temp"} scripts.a3a83e70.js:1
Object {type: "board", key: "AmbientTemperature", value: "2.233590E+01", AmbientTemperature: "2.233590E+01", source: "temp"} scripts.a3a83e70.js:1
Object {0: "2.351650E+01", type: "Temperature", key: "0", value: "2.351650E+01", source: "temp"} scripts.a3a83e70.js:1
Object {0: "4.774000E-02", type: "Potential", key: "0", value: "4.774000E-02", source: "temp"}

I am at a loss as to what is going on ? isolate scope ?

Regards

Gary

[kumorig]

ng-websockets events doesn't trigger a angular $digest. (Which I really think it should, btw.). Anyway, all you have to do is trigger it yourself.

$scope.message = message;
$scope.apply(); 

This can potentially trigger an error if angular is already in a digesting state. One easy way to waif for the previous digest to complete is to use $timeout. (You have to inject it):

angular.module('bedappApp').controller('MainCtrl', function ($scope, $timeout, $websocket) {
    ...
    ws.$on('event', function (message) {
        $timeout(function(){
            $scope.message = message;
        });
    });

(Using $timeout without a delay-value will run a function immediately or as soon as the current digest finishes).

[jfranki]

I am new to AngularJS and this one was driving me nuts, I even looked everything there is to know about scopes and inheritance.

The solution of @kumorig works, but is missing the '$':

$scope.message = message;
$scope.$apply();

It really is a valid workaround, but it kind of "de-angularizes" the main purpose of websockets:

$apply() is used to execute an expression in angular from outside of the angular framework.

Is there another way of achieving this with ng-websocket or something that we are missing?