AngularJSでビューが更新されない

Question

モデルプロパティを更新しても、イベントコールバックでモデルを更新するときにビューに影響はありません。

これは私のサービスである：

angular.service('Channel', function() {   
    var channel = null; 

    return {   
     init: function(channelId, clientId) { 
      var that = this;   

      channel = new goog.appengine.Channel(channelId); 
      var socket = channel.open(); 

      socket.onmessage = function(msg) { 
       var args = eval(msg.data);    
       that.publish(args[0], args[1]); 
      }; 
     }  
    }; 
}); 

publish()機能はコントローラに動的に追加されました。

コントローラー：

App.Controllers.ParticipantsController = function($xhr, $channel) { 
    var self = this; 

    self.participants = [];  

    // here publish function is added to service 
    mediator.installTo($channel); 

    // subscribe was also added with publish   
    $channel.subscribe('+p', function(name) { 
     self.add(name);  
    });     

    self.add = function(name) {  
     self.participants.push({ name: name });  
    } 
}; 

App.Controllers.ParticipantsController.$inject = ['$xhr', 'Channel']; 

ビュー：

<div ng:controller="App.Controllers.ParticipantsController">  
    <ul> 
     <li ng:repeat="participant in participants"><label ng:bind="participant.name"></label></li> 
    </ul> 

    <button ng:click="add('test')">add</button> 
</div> 

だから、問題のボタンをクリックすると、ビューを正しく更新しますが、私はチャンネルナッシングからメッセージを取得するときにも、add()起こるということです機能は

Answer 1

と呼ばれています。$scope.$apply()がありません。

角度の世界の外から何かをタッチするたびに、角度に通知するには$applyに電話する必要があります。それはから次のようになります。（ディレクティブで扱う）（$ HTTPサービスによって処理）

• XHRコールバック
• setTimeoutコールバック（$deferサービスによって処理）
• DOMイベントコールバック

でご場合は、このような何か：

// inject $rootScope and do $apply on it 
angular.service('Channel', function($rootScope) { 
    // ... 
    return { 
    init: function(channelId, clientId) { 
     // ... 
     socket.onmessage = function(msg) { 
     $rootScope.$apply(function() { 
      that.publish(args[0], args[1]); 
     }); 
     }; 
    } 
    }; 
});