O ideal seria que você filtrasse a sua busca no servidor para não consumir recurso. Porém se você quiser limitar o número de registros no AngularJS
você pode usar o filtro limitTo
:
limitTo
Cria um novo array
ou string
contendo apenas o número especificado de elementos. Os elementos são tirados do início ou final do array
base, string
ou number
, como específicado pelo valor e sinal (positivo ou negativo) do limite.
O uso se dá por:
HTML
{{ limitTo_expression | limitTo : limit : begin}}
Javascript
$filter('limitTo')(input, limit, begin)
No seu exemplo ficaria
$scope.services = $filter('limitTo')(data, 5, 0);
Exemplo funcional:
(function() {
'use strict';
angular
.module('appExemploLimitado', []);
angular
.module('appExemploLimitado')
.controller('LimiteController', LimiteController);
LimiteController.$inject = ['$filter'];
function LimiteController($filter) {
var limite = this;
iniciar();
function iniciar() {
limite.registros = [];
limite.registros.push('Registro 1');
limite.registros.push('Registro 2');
limite.registros.push('Registro 3');
limite.registros.push('Registro 4');
limite.registros.push('Registro 5');
limite.registros.push('Registro 6');
limite.registros.push('Registro 7');
limite.registros.push('Registro 8');
limite.registros.push('Registro 9');
limite.registros.push('Registro 10');
limite.maximo = 5;
}
}
})()
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js" type="text/javascript"></script>
<div ng-app="appExemploLimitado">
<div ng-controller="LimiteController as limite">
Máximo de registros: <input type="number" name="input" ng-model="limite.maximo" min="1" max="10" required>
<div ng-repeat="registro in limite.registros | limitTo:limite.maximo:0">
<h3>{{registro}}</h3>
</div>
</div>
</div>