Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I'm trying to generate HTML table from json in AngularJS. I receive JSON in format like this: enter image description here

My Service for getting the data looks like this :

customAPI.getUsers = function() {
            return $http({
                method: 'JSONP',
                url: 'http://arka.foi.hr/WebDiP/2013_projekti/WebDiP2013_069/api/admin/users.php'
            });
        };

and controller for that code looks like this

controller('usersController', function($scope, customAPIservice) {
        $scope.filterName = null;
        $scope.usersList = [];

        /*Search*/
        $scope.searchFilter = function(user) {
            var keyword = new RegExp($scope.filterName, 'i');
            return !$scope.filterName || keyword.test(user.korisnici.korisnik_ime) || keyword.test(user.korisnici.korisnik_prezime);
        };

        customAPIservice.getUsers().success(function(response) {
            $scope.usersList = response.korisnici;
        });
    });

and my view looks like this :

<input type="text" ng-model="nameFilter" placeholder="Trazi..."/>
<h2 >Korisnici</h2>
<table>
    <thead>
        <tr>
            <th colspan="6">Korisnici sustava</th>
        </tr>

    <th>Surname</th>
</thead>
<tbody>
    <tr ng-repeat="user in usersList| filter: searchFilter">
        <td>{{$index + 1}}</td>


        <td>{{user.korisnik.korisnik_prezime}}</td>
        <td>{{user.korisnik.korisnik_username}}</td>
    </tr>


    <tr  ng-show="usersList == ''">
        <td colspan="5">
            <img src="img/ajax-loader.gif" />
        </td>
    </tr>

</tbody>
</table>

I think I messed up somewhere with binding the data with the view but I' still pretty new with angular so I can't find what is wrong. Also I've looked up over internet and couldn't find anything.Please help.

share|improve this question
    
In your controller you have customAPIservice but your service is defined as customAPI –  leaksterrr Jun 1 at 19:16
    
Yeah I know but this is just one part of the service js so this stuff works because I recieve JSON response, making table out of it is a problem –  T0plomj3r Jun 1 at 19:24

1 Answer 1

You are not correctly access the properties in your data. Use:

/*Search*/ $scope.searchFilter = function(user) { var keyword = new RegExp($scope.filterName, 'i'); return !$scope.filterName || keyword.test(user.korisnik.korisnik_ime) || keyword.test(user.korisnik.korisnik_prezime); };

share|improve this answer
    
probably You're right but I can't test it properly because I can't generate table :/ –  T0plomj3r Jun 1 at 19:25
    
Add Batarang so you can see what data is being loaded? chrome.google.com/webstore/detail/angularjs-batarang/… –  Simon H Jun 1 at 19:27
    
I did and It says that scope is empty,problem is somewhere here: customAPIservice.getUsers().success(function(response) { $scope.usersList = response.korisnici; }); and ng-repeat. It seems like I don't add any data to scope. –  T0plomj3r Jun 1 at 19:37
    
If you want to create a plunkr I could look at that –  Simon H Jun 2 at 10:19

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.