Угловая диаграмма не обновляется при изменении данных

Question

У меня есть панель Angular Chart, которая, как предполагается, обновляется по событию ng-click, который извлекает данные JSON из сервлета. Проблема в том, что, хотя данные обновляются в области $, диаграмма не отражает обновление. Почему это происходит? Есть ли способ перерисовать диаграмму вручную? Я не мог найти много документации на сайте Angular Chart.

EDIT: В соответствии с просьбой я также приложил шаблон, может ли это быть связано с тем, что у меня есть тот же контроллер на двух разных divs?

<div class="row" ng-controller="mygraphcontroller as chart"> 
     <!-- other things --> 
     <a ng-click="applyFilterGraph()" class="btn btn-lg btn-primary btn-raised">Apply</a> 
     <!-- other things --> 
    </div> 

    <div class="row"> 
     <div class="col-md-12" ng-controller="mygraphcontroller as chart"> 
      <div class="panel panel-default"> 
       <div class="panel-heading">*****</div> 
       <div class="panel-body"> 
        <canvas id="bar" class="chart chart-bar" data="data" labels="labels"></canvas> 
       </div> 
      </div> 
     </div> 
    </div> 

app.controller('mygraphcontroller', ['$scope', '$http', '$log', function($scope,$http,$log) { 

    $scope.labels = []; 
    $scope.data = []; 

    // THE FOLLOWING POST WORKS FINE ON RUNTIME 

    $http({ 
     method: 'POST', 
     url: '/myservlet', 
     params: { param1: 'param1' } 
    }).success(function(result) { 

     var slabels = []; 
     var array = []; 
     var sdata = [array]; 

     for (var i = 0; i < result.length; i++) { 
      slabels.push(result[i].company.companyDescription); 
      array.push(result[i].value); 
     } 

     $scope.labels.push.apply($scope.labels,slabels); 
     $scope.data.push.apply($scope.data,sdata); 

    }).error(function(result) { 
    }); 

    // THIS ONE DOES NOT WORK, CHART IS NOT UPDATED 

    $scope.applyFilterGraph = function() { 

     $scope.labels = []; 
     $scope.data = []; 


     $http({ 
      method: 'POST', 
      url: '/myservlet', 
      params: { param2: 'param2' } 
     }).success(function(result) { 

     var slabels = []; 
     var array = []; 
     var sdata = [array]; 

     for (var i = 0; i < result.length; i++) { 
      slabels.push(result[i].company.companyDescription); 
      array.push(result[i].value); 
     } 

     $scope.labels.push.apply($scope.labels,slabels); 
     $scope.data.push.apply($scope.data,sdata); 

     }).error(function(result) { 
     }); 

    }; 

Answer 1

Похоже, что это либо проблема присвоения имен или как ваш контроллер связан с шаблоном

Попробуйте изменить ng-controller="mygraphcontroller chart" к ng-controller="mygraphcontroller"

Вы также привязывая его к двум различным дивы, попробуйте привязывая его к одному, который охватывает весь файл, div верхнего уровня, который установлен в ng-controller="mygraphcontroller"