/app/public/js/libs/angular/docs/partials/api/ng.filter:limitTo.html

 1<h1><code ng:non-bindable="">limitTo</code>
 2<span class="hint">(filter in module <code ng:non-bindable="">ng</code>
 3)</span>
 4</h1>
 5<div><h2 id="Description">Description</h2>
 6<div class="description"><p>Creates a new array containing only a specified number of elements in an array. The elements
 7are taken from either the beginning or the end of the source array, as specified by the
 8value and sign (positive or negative) of <code>limit</code>.</p>
 9
10<p>Note: This function is used to augment the <code>Array</code> type in Angular expressions. See
11<a href="api/ng.$filter"><code>ng.$filter</code></a> for more information about Angular arrays.</p></div>
12<h2 id="Usage">Usage</h2>
13<div class="usage"><pre class="prettyprint linenums">filter:limitTo(array, limit);</pre>
14<h3 id="Parameters">Parameters</h3>
15<ul class="parameters"><li><code ng:non-bindable="">array � {Array} � </code>
16<p>Source array to be limited.</p></li>
17<li><code ng:non-bindable="">limit � {string|Number} � </code>
18<p>The length of the returned array. If the <code>limit</code> number is
19positive, <code>limit</code> number of items from the beginning of the source array are copied.
20If the number is negative, <code>limit</code> number  of items from the end of the source array are
21copied. The <code>limit</code> will be trimmed if it exceeds <code>array.length</code></p></li>
22</ul>
23<h3 id="Returns">Returns</h3>
24<div class="returns"><code ng:non-bindable="">{Array}</code>
25� <p>A new sub-array of length <code>limit</code> or less if input array had less than <code>limit</code>
26elements.</p></div>
27</div>
28<h2 id="Example">Example</h2>
29<div class="example"><h4>Source</h4>
30<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-203" source-edit-css="" source-edit-js="script.js-202" source-edit-unit="" source-edit-scenario="scenario.js-204"></div>
31<div class="tabbable"><div class="tab-pane" title="index.html">
32<pre class="prettyprint linenums" ng-set-text="index.html-203" ng-html-wrap=" angular.js script.js"></pre>
33<script type="text/ng-template" id="index.html-203">
34  
35  <div ng-controller="Ctrl">
36    Limit {{numbers}} to: <input type="integer" ng-model="limit">
37    <p>Output: {{ numbers | limitTo:limit }}</p>
38  </div>
39</script>
40</div>
41<div class="tab-pane" title="script.js">
42<pre class="prettyprint linenums" ng-set-text="script.js-202"></pre>
43<script type="text/ng-template" id="script.js-202">
44    function Ctrl($scope) {
45      $scope.numbers = [1,2,3,4,5,6,7,8,9];
46      $scope.limit = 3;
47    }
48  </script>
49</div>
50<div class="tab-pane" title="End to end test">
51<pre class="prettyprint linenums" ng-set-text="scenario.js-204"></pre>
52<script type="text/ng-template" id="scenario.js-204">
53  it('should limit the numer array to first three items', function() {
54    expect(element('.doc-example-live input[ng-model=limit]').val()).toBe('3');
55    expect(binding('numbers | limitTo:limit')).toEqual('[1,2,3]');
56  });
57
58  it('should update the output when -3 is entered', function() {
59    input('limit').enter(-3);
60    expect(binding('numbers | limitTo:limit')).toEqual('[7,8,9]');
61  });
62
63  it('should not exceed the maximum size of input array', function() {
64    input('limit').enter(100);
65    expect(binding('numbers | limitTo:limit')).toEqual('[1,2,3,4,5,6,7,8,9]');
66  });
67</script>
68</div>
69</div><h4>Demo</h4>
70<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-203" ng-eval-javascript="script.js-202"></div></div>
71</div>