Angular，socket.io和setInterval-如何管理视图更改

Question

I have an angularjs based webapp which is complemented by an ExpressJS + socket.io + Node backend. Most of the data traffic is based on REST Web Services, except for some realtime graphs. The data is pushed using a setInterval when the socket.on('connection') is established. Here is the code.

socket.on('connection', function(
    socket.on('handshake', function(socket) {
        console.log("handshake data recieved", socket.id);
        // restart();
        dashboardInterval = setInterval(function(){sendDashboardStats(socket, 'some');}, 5000);
    });
});

This keeps on running, even when the UI/Client has closed the connection. To make matters worse, there could be many users/clients at any given point of time, so how do we close only those intervals?

Answer 1

You could just cancel your interval when you want to or even when socket get disconnected by just adding clearInterval( dashboardInterval ); .

var dashboardInterval;

socket.on('connection', function(
  socket.on('handshake', function(socket) {
    console.log("handshake data recieved", socket.id);
    // restart();
    dashboardInterval = setInterval(function() {
      sendDashboardStats(socket, 'some');
    }, 5000);
  });

  socket.on('disconnect', function() {

    if (dashboardInterval) {
      cancelInterval(dashboardInterval);
    }

    io.sockets.emit('user disconnected');
  });
});