刷新范围变量不适用于范围函数答案

【问题标题】：Refreshing scope variable not working with scope function刷新范围变量不适用于范围函数
【发布时间】：2016-09-09 21:30:21
【问题描述】：

我正在尝试使用 chartJS 及其包装 angular-chart 更新我的图表数据。单击按钮时，它会在图表上添加数据，这没有问题。

我有另一个事件，它在滚动事件后更新图表。该调用效果很好，它调用的函数与以前完全相同。但是我的 $scope.valuesData 没有更新。然后我在函数后面添加了一个$scope.$apply()，它用正确的值重新绘制了整个图表。

问题是：

为什么当我从控制器调用函数 AddData 时我的 $scope.chartValues 没有更新（以及为什么当我从 DOM 调用函数时更新了 $scope.chartValues）。这可能是数据绑定问题？
它是只更新特定范围变量而不是刷新整个范围的函数吗？

我的代码：

HTML：

<ion-scroll zooming="false" direction="x" delegate-handle="scroller" on-scroll="getScrollPosition()" has-bouncing="true" scroll-event-interval="30000">
  <div class="chart_wrapper" ng-style="{ 'width': myWidth + '%' }"> 
      <canvas  class="chart-bar" chart-data="data2" chart-labels="labels" chart-dataset-override="datasetOverride2" chart-options="options2" ng-click="goToMetrics()" ">
      </canvas>    
 </div>
</ion-scroll>

<button class="button button-small button-calm" ng-click="addValues()">Add Data </button>

JS（控制器）：

  $scope.getScrollPosition = function(){
  var pos =             $ionicScrollDelegate.$getByHandle('scroller').getScrollPosition().left ; 
  if (pos == 0 && $scope.flag == -1){
     $scope.flag = 0;
     //setTimeout($scope.addValues(), 1000);
     $scope.addValues();
  }
  if (pos < 0){
    $scope.flag = -1;
  }
 };


  $scope.addValues = function(){
  console.log('add');
  // Retrieve values
  var week = Graph.getData();
  var pp = $scope.chartData; 
  var mm = $scope.labels;

  // Add values to the chart and update the chart width 
  var tmp = Graph.addBegin(pp, mm,  week);
  $scope.valuesData = tmp.values; 
  $scope.myWidth = $scope.myWidth + tmp.length * 4 ; 
 };

任何帮助表示赞赏

【问题讨论】：

它可能不相关，但您可以使用$timeout 服务，它可以更好地捕获错误。
@PatrickFerreira 不相关，即使我不使用延时功能也会出现同样的问题

标签： angularjs ionic-framework scope chart.js angular-chart

【解决方案1】：

因为 setTimeout 在角度上下文之外运行，所以使用 $timeout 版本。
不。您可以使用 $scope.$digest() 来检查当前范围的更改，而不是所有 $scope 树；

【讨论】：

感谢您的回答。我更新了我的问题，同样的问题也发生在不使用超时函数（setTimeout 或 $timeout）的情况下。
相同的答案 - 滚动称为外部角度上下文。您应该使用 $scope.$apply 或 $timeout 或 $digest。 Angular 无法与未包装的 dom 事件互操作
好的，现在可以使用 $timeout，谢谢！。你能解释一下为什么调用使用 $timeout 吗？
$timeout(doSmth) 大致等价于 setTimeout(function(){$scope.$apply(doSmth)});您的数据通过双向绑定进行角度同步。实际上你的电话有效，但角度应用程序的相关部分没有与新值同步。 $scope.$apply 只是在整个应用程序中同步和传播更改。