title: Limiting number of displayed results when using ngRepeat
body: <p>I find the <a href="https://docs.angularjs.org/tutorial" rel="noreferrer">AngularJS tutorials</a> hard to understand; this one is walking me through building an app that displays phones. I’m on <a href="https://docs.angularjs.org/tutorial/step_05" rel="noreferrer">step 5</a> and I thought as an experiment I’d try to allow users to specify how many they’d like to be shown. The view looks like this:</p>
  
  <pre><code>&lt;body ng-controller="PhoneListCtrl"&gt;
  
    &lt;div class="container-fluid"&gt;
      &lt;div class="row-fluid"&gt;
        &lt;div class="span2"&gt;
          &lt;!--Sidebar content--&gt;
  
          Search: &lt;input ng-model="query"&gt;
          How Many: &lt;input ng-model="quantity"&gt;
          Sort by:
          &lt;select ng-model="orderProp"&gt;
            &lt;option value="name"&gt;Alphabetical&lt;/option&gt;
            &lt;option value="age"&gt;Newest&lt;/option&gt;
          &lt;/select&gt;
  
        &lt;/div&gt;
        &lt;div class="span10"&gt;
          &lt;!--Body content--&gt;
  
          &lt;ul class="phones"&gt;
            &lt;li ng-repeat="phone in phones | filter:query | orderBy:orderProp"&gt;
              {{phone.name}}
              &lt;p&gt;{{phone.snippet}}&lt;/p&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
  
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I’ve added this line where users can enter how many results they want shown:</p>
  
  <pre class="lang-html prettyprint-override"><code>How Many: &lt;input ng-model="quantity"&gt;
  </code></pre>
  
  <p>Here’s my controller:</p>
  
  <pre><code>function PhoneListCtrl($scope, $http) {
    $http.get('phones/phones.json').success(function(data) {
      $scope.phones = data.splice(0, 'quantity');
    });
  
    $scope.orderProp = 'age';
    $scope.quantity = 5;
  }
  </code></pre>
  
  <p>The important line is:</p>
  
  <pre><code>$scope.phones = data.splice(0, 'quantity');
  </code></pre>
  
  <p>I can hard-code in a number to represent how many phones should be shown. If I put <code>5</code> in, 5 will be shown. All I want to do is read the number in that input from the view, and put that in the <code>data.splice</code> line. I’ve tried with and without quotes, and neither work. How do I do this?</p>