Question

我需要一些帮助来理解下面的代码。它取自：

http://www.html5rocks.com/en/tutorials/frameworks/angular-websockets

工厂：

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);
          }
        });
      })
    }
  };

控制器：

function AppCtrl($scope, socket) {

  // Socket listeners
  // ================

  socket.on('init', function (data) {
    $scope.name = data.name;
    $scope.users = data.users;
  });

  $scope.sendMessage = function () {
    socket.emit('send:message', {
      message: $scope.message
    });

    // add the message to our model locally
    $scope.messages.push({
      user: $scope.name,
      text: $scope.message
    });

    // clear message box
    $scope.message = '';
  };
}

我怀疑是：

控制器调用socket.on('init',function(data){.....});后的控制流程是什么。在工厂中调用socket.on时，它需要两个参数eventName和callback。这是什么回调？
我们为何使用$rootScope.apply
什么是callback.apply？

Answer 1

1.控制器调用socket.on（'init'，function（data）{.....}）;后，控制流程是什么？在工厂中调用socket.on时，它需要两个参数eventName和callback。这是什么回调？

从您的控制器调用socket.on没有任何特殊之处。这样做只是直接调用工厂中的on方法。

一旦清楚，很容易看出callback只是传递给该函数的第二个参数。在本例中，它是函数function (data) { $scope.name = data.name; $scope.users = data.users; }

2.我们为什么要使用$ rootScope.apply

https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$apply

确保在其中的函数中发生的任何事情都在摘要周期中被选中。

3.什么是callback.apply？

任何JavaScript函数都存在apply method。这里使用它来调用带有套接字的callback作为this参数，并将事件处理程序的参数作为参数。

AngularJs工厂和控制器流程的控制

1 个答案: