Showing data in angular UI grid

Question

I have a problem a problem with showing data in ui grid table.

I have defined an API from which I want to show data and I can access them through the browser, but the problem is in showing rendered data. Here is my angular controller in which I've defined function for getting data from API:

        getData();

        $scope.myData = [];

        $scope.gridOptions.data = []

        $scope.gridOptions.data = $scope.myData; 

        function getData() {
            $http.get('/load/').success(function (data) {
                data.forEach( function( row, index ) {
                    $scope.myData.push(data);
                });
                $scope.gridOptions.data = data;
                console.log('data from api', data);
            })
        };

and I got empty grid.

Data are showed in console:

I've also tried to parse data var jsonObj = JSON.parse(data);, but I got an error Unexpected token o at Object.parse (native)

Morgan Hayes · Accepted Answer · 2016-03-23 22:23:51Z

1

Use this function to push your data into an array. Check your data in the console, drill down into your data. (click on the arrow) My data is within the .doc yours may be within another attribute. change the "items[i].doc" to the correct attribute for your data.

// pass data.rows to function items params
// the type is to filter 
function fncArray(items,type) {
    var filtered = [];
    for(var i=0; i < items.length; i++)  {
        if ( items[i].doc.type = type){
            filtered.push(items[i].doc);
        }
    }
    // console.log(filtered);
   return filtered;
}

this is to use without filtering

// pass data.rows to function items params 
function fncArray(items) {
    var newData= [];
    for(var i=0; i < items.length; i++)  {
            newData.push(items[i].doc);
    }
   return newData;
}

answered Mar 23, 2016 at 22:23

Morgan Hayes

3832 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

oto lolua · Accepted Answer · 2016-02-12 11:09:21Z

0

you can write $scope.$apply() to trigger changes in controller

answered Feb 12, 2016 at 11:09

oto lolua

5094 silver badges17 bronze badges

2 Comments

corry Over a year ago

I got an Error: [$rootScope:inprog] $digest already in progress

oto lolua Over a year ago

you can check it if phase is running if(!$scope.$$phase) { $scope.$apply()}

Ananda Naphade · Accepted Answer · 2016-02-12 11:18:28Z

0

Returned data should be ["key":[object, object, object, object]] in this form. 1) convert this data using var jsonObj = JSON.parse(data); 2) Use this expression in success !$scope.$$phase?$scope.$apply():null;

answered Feb 12, 2016 at 11:18

Ananda Naphade

573 bronze badges

1 Comment

corry Over a year ago

I've tried this and again the same error appears: Unexpected token o at Object.parse (native)

corry · Accepted Answer · 2016-02-12 13:39:01Z

0

I'm sorry guys, my mistake here. There is no need for parsing. I've defined wrong columnDefs here in controller :facepalm:

answered Feb 12, 2016 at 13:39

corry

1,5497 gold badges34 silver badges64 bronze badges

Collectives™ on Stack Overflow

Showing data in angular UI grid

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related