angularjs 不使用 $rootscope 和 $broadcast答案

【问题标题】：angularjs not using $rootscope and $broadcastangularjs 不使用 $rootscope 和 $broadcast
【发布时间】：2015-06-13 21:51:25
【问题描述】：

所以基本上我试图找到一种方法来防止使用 $rootscope 、$broadcast 和 $apply。我先给你看代码：

         app.controller('firstController', function ($scope, ServiceChatBuddy, socketListeners){ 

            $scope.ChatBuddy = ServiceChatBuddy;
            $scope.$on('user delete:updated', function (event, id) {
                $scope.ChatBuddy.users[id]['marker'].setMap(null);
                delete $scope.ChatBuddy.users[id];
            });
            $scope.$on('loadPosition:updated', function (event, data) {
                $scope.$apply(function () {
                    $scope.ChatBuddy.users[data.id] = data.obj;
                });
             // and a bunch more like these
            });
          })

socketListeners 是我在工厂中实现的第 3 方库 (socket.io)，它会在事件发生时广播数据

      socketModule.factory('socketListeners', function ($rootScope, decorateFactory) {
          var sockets = {};
          var socket = io.connect('http://localhost:8000');
          sockets.listen = function () {
                socket.on('loadPosition', function (data) {
                    $rootScope.$broadcast('loadPosition:updated', data)
            });
            socket.on('client leave', function (id) {
                $rootScope.$broadcast('user delete:updated', id);
            });
            // and a bunch more of these
       });

如您所见，代码中存在很多 $rootscope $broadcasts 和 $apply;

所以我正在努力寻找一种更“专业”的方法。绝对欢迎任何提示技巧最佳实践！干杯

【问题讨论】：

标签： javascript angularjs socket.io

【解决方案1】：

试试这个https://github.com/btford/angular-socket-io

socket.js（服务）

angular.module('app')
.service('socket', function (socketFactory) {
    var socket = io.connect('http://localhost:8000');

    var mySocket = socketFactory({
        ioSocket: socket
    });

    return mySocket;
});

firstController.js

app.controller('firstController', function ($scope, socket){

    socket.forward('user delete:updated', $scope);
    socket.forward('loadPosition:updated', $scope);

    $scope.$on('user delete:updated', function (event, id) {
        $scope.ChatBuddy.users[id]['marker'].setMap(null);
        delete $scope.ChatBuddy.users[id];
    });
    $scope.$on('loadPosition:updated', function (event, data) {
        $scope.$apply(function () {
            $scope.ChatBuddy.users[data.id] = data.obj;
        });
        // and a bunch more like these
    });
});

当作用域被销毁时，监听器也被销毁:)

【讨论】：