I’m at a loss right now, I’m working on a very simple page that consists of a grid that fetches data based on a date from out mySQL DB.

There’s a similar page which works just fine that I’m using as a reference, but for the life of me I can’t get the grid to just display the data bound to it.

This is the function that’s called when the page is loaded, it calls an API that returns a HTTP response with all the data.

$scope.flowGrid = FlowProfilesService.flowProfile;

const start = async function() {
    try {
        $scope.loading = true;

        var tempData = await FlowProfilesService.getAllFlowProfiles();

        var date = tempData.data[0].rec_date;
        $scope.formattedDate = date.split('T')[0];
        $scope.dt = new Date($scope.formattedDate);
        console.log($scope.formattedDate);
        console.log($scope.dt);

        var flowData = await FlowProfilesService.getFlowProfileByDate($scope.formattedDate);
        $scope.gridData = flowData.data;

    } catch (e) {
        console.log("Could not retrieve data ", e);
    } finally {
        var gridInstance = $("#flowGrid").dxDataGrid("instance");
        gridInstance.refresh();

        $scope.loading = false;
    }
}

All the variables are being populated correctly, there’s multiple valid rows in $scope.gridData

The properties of the grid

 this.flowProfile = {
     bindingOptions: {
         dataSource: 'gridData',
     },
     allowColumnResizing: false,
     height: 800,
     columnAutoWidth: true,
     columnChooser: {
         enabled: true,
         mode: "dragAndDrop"
     },
     rowAlternationEnabled: true,
     paging: {
         pageSize: 15
     },
     pager: {
         showPageSizeSelector: true,
         allowedPageSizes: [15, 25, 50],
         showInfo: true
     },
     stateStoring: {
         enabled: true,
         type: "localStorage",
         storageKey: "storage"
     },
     scrolling: {
         mode: "virtual"
     },

There’s zero errors popping up.

I’ve also tried .$apply() along with a timeout. They did nothing either.

Setting the dataSource after fetching the data also didn’t work.

I just don’t understand why this one page isn’t working like the rest of them?