Angularjs Examples

AJS Examples


AngularJS Set Start Position to Display Array Elements Using LimitTo Filter

In this AngularJS limitto filter example you will learn how to set start position to display array elements using limitTo filter.

Here you can view the output of the example and you can also "try it yourself" by clicking on "Live Demo" button given at the bottom.

Syntax

{{Array[] | limitTo:5:2}}

Set Start Position to Display Array Elements Using LimitTo Filter Example

<!DOCTYPE html>          
<html>          
<head> <!-- www.techstrikers.com -->           
 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular.min.js"></script>           
    <meta charset="utf-8">          
    <title>AngularJS Set start position to display array elements</title>          
  <script>          
var app = angular.module('app', []);          
    app.controller("ParentController", function ($scope) {  
       
    $scope.employees = [{
        firstName:"Jimi",
        lastName:"Scott",
        jobTitle:"Developer",
        salary:20000,
        phone:"345-333-7845"
      },
      {
          firstName:"Bailey",
          lastName:"Lee",
          jobTitle:"Lead",
          salary:30000,
          phone:"322-121-213"
      },
      {
          firstName:"Aura",
          lastName:"Martin",
          jobTitle:"QA",
          salary:35000,
          phone:"322-333-0987"
      },
      {
          firstName:"Austin",
          lastName:"Williams",
          jobTitle:"Designer",
          salary:20000,
          phone:"322-265-2321"
      },
      {
          firstName:"Bara",
          lastName:"Miller",
          jobTitle:"Tester",
          salary:15000,
          phone:"322-890-2321"
      },{
          firstName:"Carlton",
          lastName:"Taylor",
          jobTitle:"Manager",
          salary:45000,
          phone:"322-456-2321"
      },
      {
          firstName:"Adisa",
          lastName:"White",
          jobTitle:"Developer",
          salary:25000,
          phone:"121-333-2321"
      }];
    });   
</script>          
</head>          
<body style="background-color:#DDE4E9;">          
  <fieldset style="background-color:#DDE4E9;">                      
    <legend>Set start position to display array elements</legend>           
  <div ng-app="app">   
    <div ng-controller="ParentController">   
      <ul ng-repeat="emp in employees | | limitTo:7:5">
        <li>Name : {{ emp.firstName + ' ' + emp.lastName }}</li>
        <li>Job Title : {{ emp.jobTitle }}</li>
        <li>Salary : {{ emp.salary }}</li>
        <li>Phone : {{ emp.phone }}</li>
    </ul>
  </div>  
</div>          
</div>          
 </fieldset>           
</body>          
</html>