javascript - Angular 绑定(bind)错误

Question

我有工厂“Chat”，它通过socket.io 连接到我的nodejs 服务器并向服务器发送消息。

.factory('Messages', function($ionicScrollDelegate){
    var messages = [];
    return {
      getMessages : function(){
        return messages;
      },
      setMessage : function(msg){
        messages.push(msg);
      }
    }
  })    
.factory('Chat', function(Socket, Messages){
    Socket.on('onChat', function(data){
       if (data.from !== username){
          Messages.setMessage({username : data.from, message : data.msg});
       }
    });
    return : {
       sendMessage: function(msg){
          Messages.setMessage({
             username: username,
             message: msg
          });
          Socket.request(route, {
             rid: 'AA',
             content: msg,
             from: username,
             target: '*'
          }, function() {
          });
    }

我的 Controller 检查来自工厂的消息。

.controller('livePageCtrl', function($scope, Messages, Chat){
   $scope.data = {};
   $scope.data.message = "";
   $scope.messages = Messages.getMessages();
   $scope.sendMessage = function(msg){
      Chat.sendMessage(msg);
      $scope.data.message = "";
   };
});

和我的 View 表单

<div class="chat">
   <div class="row" ng-repeat="message in messages track by $index">
      <div class="col col-100"">
         {{message.message}}
      </div>
    </div>
 </div>
 <input ng-model="data.message" type="text" placeholder="Chat to Room">
 <button type="submit" ng-click="sendMessage(data.message)"></button>

当我输入消息并按按钮发送更新的 arr 消息时，我可以在 DOM 中看到消息，但是如果我从服务器收到新消息，我的消息 arr 会更新，但 DOM 不会更新。只有在我开始输入新消息 DOM 更新后，我才能看到传入的消息。我做错了什么？为什么我的 DOM 在服务器收到新消息后不更新？ 谢谢大家!抱歉我的英语)

Answer 1

这里的问题是 $digest 循环没有运行，很可能是因为 Angular 不知道新项目何时从套接字到达。 Angular 通常会自动运行 $digest 循环，例如当 ng-click 被触发或 $http 调用解析时。但在这种情况下，您需要手动调用此过程。

你可以尝试:

Socket.on('onChat', function(data){
   if (data.from !== username){
      $timeout(function(){
          Messages.setMessage({username : data.from, message : data.msg});
      });          
   }
});

不要忘记将 $timeout 导入您的聊天工厂。