not updated template view -> it needs mous scroll, or clear input

Question

I'm using angular.js with stomp-websockets,sock.js under by this tutorial http://g00glen00b.be/spring-websockets-angular/. I'm getting messages from websocket, but template view isn't refreshed after message from websocket is arrived. When I want to update template view I need to clear input box, or scroll with mouse.

$scope.initiator = false;   
$scope.socket = {
    client: null,
    stomp: null
};

$scope.initSockets = function() {
   $scope.socket.client = new SockJS('/myUrl');
   $scope.socket.stomp = Stomp.over($scope.socket.client);

   $scope.notifyMessage = function(message) {
       $scope.initiator = true;
       $scope.messages.push(message)
   };

   $scope.socket.stomp.connect({}, function() {         
       $scope.socket.stomp.subscribe("/topic/messages", $scope.notifyMessage);                      
   });      

   $scope.socket.client.onclose = $scope.reconnect;     
};

$scope.initSockets();   


template view:
<ul><li ng-repeat="item in messages track by $index">{{item}}</li></ul>

Answer 1

You probably need to use scope.$apply to have it take effect. afaics sock.js is not made for angular, so you need to let angular know something has changed on the scope. You do this using scope.$apply.

$scope.notifyMessage = function(message) {
   $scope.$apply(function(){
       $scope.initiator = true;
       $scope.messages.push(message)
   });
};