1

I am working on Angularjs ui grid and I want to refresh the data in the grid every 1 min. Hence I used $interval to fire a function which would fetch the data and the output of he function needs to be bind to the ui-grid.

Without the use of $interval, the function output binds successfully to grid (although without refresh every 1 min!). However, with $interval, the output does not bind to grid.

Below is my code,

var grdDataPromise;

function GetData() {
        return InfoDataService.getDummyDetails($scope.getDtToday(), 'ABC', 'PQR');
}

$scope.startGetData = function () {
    $scope.stopGetData();
    grdDataPromise = $interval(GetData, REFRESH_RATE);
    grdDataPromise.then(function (result) {
    $scope.gridOptionsDashBoard.data = result;
});
}

$scope.startGetData();

$scope.stopGetData = function () {
        $interval.cancel(grdDataPromise);
}

$scope.$on('$destroy', function () {
        $scope.stopGetData();
});

Here, the grdDataPromise.then() function never fires, which I believe is the problem, but I am unable to find a fix for this issue.

Can anyone suggest how can I make the data bind to the grid after the function executes every 1 minute interval?

Thanks in advance.

stack underflow
  • 197
  • 2
  • 5
  • 18

1 Answers1

0

See the documentation for dynamic data for ui-grid. If you read closely, it says you must manually fire off a data changed event so that the grid knows there's new data for display. Reading this other tutorial will show you how to do just that. Specifically, you need to call:

$scope.gridApi.core.notifyDataChange(uiGridConstants.dataChange.COLUMN);

where

dataChange.* 

is a ui-grid constant that says what changed. I can't post more than 2 links at the moment but if you search the ui-grid API documentation for "uiGridConstants", you'll find them. Be sure to also include the required dependencies into your app, that can be easy to forget.