Question

我有一个旧的离子App（离子v 1.3.x）。根据在App的另一部分中检测到的某些异步更改，它会发出$ rootScope级别事件。我在Controller中捕获该事件，以便在捕获该事件时更新视图。下面的内容。

// In a different part of the App an asynchronous event is caught
$rootScope.$emit("some:change:event", grpKey); // from asynchronous event

// In Controller
$rootScope.$on("some:change:event", function(event, param){
   reComputeValues(param);
}

function reComputeValues(param){
  $scope.someVariable = updated value;
  //$scope.$apply();
}

function reComputeValues_withApply(param){
   $scope.$apply(function(){
      $scope.someVariable = updated value;
   });
}

即使$ scope.someVariable正在更新（我可以在调试器中单步执行时看到它），当我在视图上时，更改不会反映在视图中。如果我离开该视图并返回到视图，页面将重新加载并且更改就在那里。

在挖掘它之后，首先看起来应用$ apply应该可以解决问题。我做了上面两种不同的方式（只是调用$ scope。$ apply或封装$ apply调用中的变量更新）。虽然这确实更新了视图，但它提供了一些似乎与某些范围问题相关的错误。我意识到这可能是因为当事件被捕获并且函数被调用时它位于$ rootScope的上下文中并且变量在$ scope级别更新，这就是为什么它在强制$时不会自动更新视图并给出错误的原因申请电话。但$ scope也是$ rootScope的子代，所以我不完全理解$ rootScope和$ scope的交互，以及为什么视图没有更新。

感谢有关如何最好地解决此问题的任何指示。

谢谢，桑杰。

Answer 1

请您尝试以下更改的代码并告诉我。

$rootScope.$emit("some:change:event", grpKey); // from asynchronous event

// In Controller
$rootScope.$on("some:change:event", function(event, param){
    $rootScope.$apply(function(){
        reComputeValues(param); 
    });
}

function reComputeValues(param){
    $scope.someVariable = updated value;
    //$scope.$apply();
}

function reComputeValues_withApply(param){
    $scope.$apply(function(){
        $scope.someVariable = updated value;
    });
}

通过$ rootScope捕获的事件对$ scope变量进行的更改不会在视图中更新

1 个答案: