在Angular.js应用程序中进行事件驱动开发的最佳实践是什么?

12

我正在为我们的Angular应用程序添加一些WebSocket功能。 WebSocket对象被包装在一个服务中。理想情况下,我们希望我们包装的socket对象具有标准事件API,以便我们可以在控制器中像下面这样使用它:(抱歉,这里使用了Coffeescript)

angular.module('myApp').controller 'myCtrl', ($scope, socket) ->
  update = (msg)->
    $scope.apply ->
      #do something regarding to the msg

  socket.on 'message', update

  unregister: ->
    socket.off 'message', update  

我们应该使用哪种最佳实践/库来实现这个目标?使用jQuery?Backbone.Events?任何建议都将有所帮助。谢谢!

1个回答

19

你不需要使用任何库来实现这个,只需要创建一个服务,在其中注入$rootscope并将事件发布到rootscope中,然后在你的控制器中监听该事件。

var socket; // this be the socketio instance.
angular.module("myApp").factory("SocketHandler", function ($rootScope) {
  var handler = function (msg) {
    $rootScope.$apply(function () {
      $rootScope.$broadcast("socketMessageReceived", msg);
    });
  };

  socket.on("message", handler);

  $rootScope.$on("unregisterSocket", function () {
    socket.off("message", handler);
  });
}).controller("myCtrl", function ($scope, SocketHandler) {
  var listener;
  var addListener = function () {
    listener = $scope.$on("messageReceived", function (e, msg) {
      console.log("New Message: " + msg);
    }); // $on returns a registration function for the listener
  };
  var removeListener = function () {
    if (listener) listener();
  };
});

感谢fastreload的回答,但这并不是我需要的。在我的例子中,控制器有能力仅为自己取消订阅套接字消息,在另一句话中,订阅是基于控制器的粒度 - 每个控制器可以决定何时订阅和何时取消订阅。你有什么想法? - KailuoWang
谢谢 fastreload。那不是一个坏的解决方案。 - KailuoWang

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接