title: Wrong array item after using orderby filter AngularJS
body: <p>I have an app that works well displaying a list of students. When you click on each name, it displays more info about that particular student. However, if I change the order of names through select options or search, wrong student info is displayed.
  Here is my view:</p>
  
  <pre><code>&lt;input type="text" ng-model="expression" placeholder="Search Student" /&gt;
  &lt;div class="select"&gt;
  &lt;span&gt;Sort By: &amp;nbsp;&lt;/span&gt;
  &lt;select ng-model="order" ng-show="students.length &gt; 0"&gt;
      &lt;option selected value="name"&gt;Name A-Z&lt;/option&gt;
      &lt;option value="-name"&gt;Name Z-A&lt;/option&gt;
      &lt;option value="room"&gt;Room (first to last)&lt;/option&gt;
      &lt;option value="-room"&gt;Room (last to first)&lt;/option&gt;           
  &lt;/select&gt;
  &lt;/div&gt;
  &lt;div ng-repeat="student in students | orderBy: order | filter:expression"&gt;        
  
  &lt;div class="info"&gt;
      &lt;div class="img"&gt;
          &lt;img ng-src="{{student.image}}"&gt;
      &lt;/div&gt;
      &lt;h2 style="color: #007acc;"&gt; Student Details For:&lt;/h2&gt;
      &lt;hr&gt;
      &lt;h2&gt;{{student.name}}&lt;/h2&gt;
      &lt;a ng-href="#!/students/{{$index}}"&gt;&lt;button&gt;View Student 
      Details&lt;/button&gt;&lt;/a&gt;
      &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Here is my Js:</p>
  
  <pre><code>var data = [
  {
      name: "Andrea Toe",
      sex: "Female",
      room: 12,
      cell: "076 861 6184",
      image: "images/female.jpg",
      checkin: "June 2016"
  },
  {
      name: "John Doe",
      sex: "Female",
      room: 3,          
      cell: "063 961 7190",
      image: "images/lebo.jpg",
      checkin: "01 Feb 2018"      
  },
  {
      name: "James Drew",
      sex: "Male",
      room: 1,
      cell: "076 910 3069",
      image: "images/male.jpeg",
      checkin: "01 Feb 2018"
   }
  ];
  app.controller("studentsCtrl", function($scope){
  $scope.students = data;
  });
  app.controller('studentInfoCtrl', ['$scope', '$routeParams', 
  function($scope, $routeParams) {
    $scope.info = data[$routeParams.id];
  }]);
  </code></pre>
  
  <p>What should I do to get it to display correct info even after using search filter or reordering using oderBy?</p>