$ scope變量不響應角度圖的onClick函數

我在頁面中有一個圖表。當在圖表上點擊一下，onClick函數就會被調用，並且它會知道用戶點擊了圖表的哪個類別。我創建了一個div來顯示$scope.cateClicked。但是，$scope.cateClicked的顯示值在div中不會改變，而在控制檯中，我可以看到該值已被函數更改。

在這裏看到我的例子：http://codepen.io/lyzy0906/pen/ggWqpJ

div和畫布：

<div>You clicked {{cateClicked}}</div> 
<canvas class="chart chart-pie" chart-click="onClick" chart-data="data" chart-labels="labels" chart-colors="color" chart-options="option"></canvas>

的onclick功能：

$scope.onClick = function(elements, evt) { 
    $scope.cateClicked = elements[0]._model.label; 
    $scope.tabIndex = 1; 
    console.log($scope.cateClicked); 
};

我怎樣才能讓DIV顯示$的價值在圖表中點擊後，scope.cateClicked？謝謝。

來源

2017-01-23 Cathy

您需要啓動摘要循環。使用'$ scope.apply'或者更好的使用'$ timeout'。 –

你需要一個$scope.$apply();作爲onClick函數的最後一件事：在他們的NG-點擊會以同樣的方式

$scope.onClick = function(elements, evt) { 
    $scope.cateClicked = elements[0]._model.label; 
    console.log($scope.cateClicked); 
    $scope.$apply(); 
};

它看起來像由不更新綁定圖表單擊。

來源

2017-01-23 04:18:18 Jorg

在摘要循環中添加$超時踢球。這工作！

angular 
     .module('StarterApp', ['ngMaterial', 'chart.js']) 
     .controller('AppCtrl', function ($scope, $timeout) { 
     $scope.cateClicked = "?"; 
     $scope.color = ["#378A58", "#3FBF4E", "#83DF1F", "#AAD466"]; 
     $scope.labels = ["A", "B", "C", "D"]; 
     $scope.data = [1, 2, 3, 4]; 
     $scope.option = {legend: {position: 'right', display: true}}; 
     $scope.onClick = function(elements, evt) { 

      $timeout(function(){ 
      $scope.cateClicked = elements[0]._model.label; 
      $scope.tabIndex = 0; 
      }, 0) 

     }; 

    });

來源

2017-01-23 04:33:04

$ scope變量不響應角度圖的onClick函數

回答

相關問題