在服务器发送事件后正确应用范围更改

时间:2015-11-05 11:33:10

标签: angularjs

我的应用程序经常收到更新,但它似乎工作正常,但有时候,特别是在要处理的数据更大的生产中,我没有看到我的范围正确更新。

以下是我实际做的事情:

var handleOrdersCallback = function (msg) {
  var data = JSON.parse(msg.data);
  $scope.$apply(function () {
    var status = data.status.status;
    var order_index = _.findIndex($scope.orders, function (order) {
      return order.id === data.id;
    });

    if (order_index > -1) {
      var previousState = $scope.orders[order_index].status.status;
      $scope.orders[order_index] = data;

      if (previousState === 'unassigned' && status === 'cancelled') {
        $scope.orders.splice(order_index, 1);
        Broadcaster.remove();
      } else if (status === 'cancelled' || status === 'completed') {
        $scope.orders.splice(order_index, 1);
      } else {
        if (status === 'assigned') {
          Broadcaster.add();
        }
        Broadcaster.update(data);
      }
    } else {
      $scope.orders.unshift(data);
      if ($scope.dataLoaded) {
        Broadcaster.add();
      }
      if (status === 'unassigned') {
        Broadcaster.new(data);
      }
    }
  });
};

var source = new EventSource('/updates');
source.addEventListener('orders', handleOrdersCallback, false);

我不知道我是否正确地将所有内容包裹在$scope.$apply内,但说实话,我不知道是否有什么需要改变,或者它是否会更好地发挥作用以不同的方式编码。

这就是我在这里问的原因。

1 个答案:

答案 0 :(得分:1)

此代码块中的问题是您如何更新$scope

$scope.orders[order_index] = data;

解决方案是使用angular.copy:

angular.copy(data, $scope.orders[order_index]);