How to get fixed number of data from json api in angularjs

Question

See Below Code:

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("http://www.w3schools.com/angular/customers.php")
         .then(function (response) {
             $scope.names = response.data.records;
         });
});

In above Example We wrote the code for getting all data in records are stored in names but the requirement is first 5 data should be stored in names.

Thanks in advance

So will your API always return back the full data and then you need to slice the data and store only the first 5 items? Or are you looking at changing your API? — Pratik Bhattacharya
– Pratik Bhattacharya, Commented Apr 22, 2016 at 6:23
No I don't want to change API. If possible to get 5 data from json api — Prabu Lakshmanan
– Prabu Lakshmanan, Commented Apr 22, 2016 at 6:27
Can you share the json format that you are getting from the API? Is it an Array or Object? — Pratik Bhattacharya
– Pratik Bhattacharya, Commented Apr 22, 2016 at 6:28
You can take a look at the answers given below, they should will solve your issue. — Pratik Bhattacharya
– Pratik Bhattacharya, Commented Apr 22, 2016 at 6:33

Grundy · Accepted Answer · 2016-04-22 06:30:39Z

5

There are two ways to do it -

Make server side changes to get five records only (I think you dont want to use this).
On client side you can use the below code

Sample:

$scope.names=[];
$.each(response.data.records.slice(0,5), function(i, data) {
    $scope.names.push(data);
});

edited Apr 22, 2016 at 6:30

Grundy

13.4k3 gold badges39 silver badges57 bronze badges

answered Apr 22, 2016 at 6:29

misss-popcorn

6103 silver badges14 bronze badges

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

Comments

Grundy · Accepted Answer · 2016-04-22 06:31:57Z

3

In this case you can just do slice from response records

$scope.names = response.data.records.slice(0,5);

Sample:

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
    $http.get("http://www.w3schools.com/angular/customers.php")
         .then(function (response) {
             $scope.names = response.data.records.slice(0,5);
         });
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
<div ng-app="myApp" ng-controller="customersCtrl">
  <pre ng-repeat="name in names">{{$index+1}}: {{name|json}}</pre>
</div>

answered Apr 22, 2016 at 6:31

Grundy

13.4k3 gold badges39 silver badges57 bronze badges

Comments

Mostafiz · Accepted Answer · 2016-04-22 06:43:20Z

0

use slice

$scope.names = response.data.records.slice(0,5);

answered Apr 22, 2016 at 6:43

Mostafiz

7,3523 gold badges30 silver badges42 bronze badges

Collectives™ on Stack Overflow

How to get fixed number of data from json api in angularjs

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related