[Chartjs]-How to wait for all items to load within ng-repeat before then rendering a chart for each item

by

1👍

✅

You could place a $watch from your controller. Giving your items on $scope a name of yourItems in your $http.get().then() completion, consider the following example

.controller('ScoringPolarCtrl', ['$scope', function($scope) {
    $scope.$watch('yourItems', function(newVal, oldVal) {
        if(newVal !== oldVal) {
            // render charts
        }
    });
}]);

You could also define a $scope function on your controller and call from directive within your $http callback. This may look different if you are isolating $scope or not, but here is the basic idea

// -- directive
$http.get('/foo').then(function(results) {
    scope.renderCharts(results); // -- async complete
});

// -- controller
$scope.renderCharts = function(results) {
    // render charts -- this is called once you receive your $http response
}

Leave a comment