view/controller 不会使用 angularjs 中的 socket.io 使用 push() 函数刷新

Question

我正在尝试刷新 angular 应用程序的控制器以接收来自 socket.io 的对象。一切正常，除了当我使用 push 函数向变量添加新对象时视图不显示。这是我的代码。

Controller.js

app.controller('controller', function(){
var vm = this;
var socket = io.connect('http://localhost:3000');
//The variable that bends
vm.messages = [];

socket.on("addMsg", function(obj){
    vm.messages.push({user: obj.user, content: obj.content, color:obj.col});
});


});

view.jade

    ...
 body(ng-controller = "controller as con")
.messages
    p Messages:
    p(ng-repeat="array in con.messages") content: {{array.content}} , color: {{array.color}}

我的代码有什么问题？目的是使用 ng-repeat 显示 p 标签中的所有内容。

Answer 1

当我尝试更新 socket.on 回调中的 angular 范围变量时，我遇到了完全相同的问题。正如@aw04 在他的评论中提到的那样，解决方法是简单地调用 $scope.$apply()

Answer 2

来自 html5rocks article angular-websocket 的这个微型 angular 工厂套接字服务将 socket.io 包装在 angular 范围内。它执行自动 $rootScope.$apply()

app.factory('socket', function ($rootScope) {
  var socket = io.connect();
  return {
    on: function (eventName, callback) {
      socket.on(eventName, function () {  
        var args = arguments;
        $rootScope.$apply(function () {
          callback.apply(socket, args);
        });
      });
    },
    emit: function (eventName, data, callback) {
      socket.emit(eventName, data, function () {
        var args = arguments;
        $rootScope.$apply(function () {
          if (callback) {
            callback.apply(socket, args);
          }
        });
      })
    }
  };
});

view/controller 不会使用 angularjs 中的 socket.io 使用 push() 函数刷新

The view/controller does not refresh with push() function using socket.io in angularjs

javascript

socket.io

angularjs

angularjs-ng-repeat

ng-controller