title: Why is my $scope not updating
body: <p>I'm having an issue whereby my $scope is refusing to update from inside an event handling function.
  The index parameter is being passed through, and the array is actually getting modified but the screen is not updating. The other references to <code>$scope.people</code> outside of the addFriend function are working perfectly.
  Really stumped!</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>myApp.controller('searchCtrl',function($scope,usrSvc,store){
    
    usrSvc.getUsers()
    .then(function success(users){
        if(users){
          $scope.people = users.data  
        }
    })
  
      
    $scope.search = function(searchterm){
      usrSvc.getUsers(searchterm)
      .then(function success(users){
        if(users){
          $scope.people = users.data  
        }
      })
    }
  
    $scope.addFriend = function(friend,index){
      usrSvc.addFriend(store.getId,friend._id)
      $scope.people.splice(0,index);
      console.log($scope.people.forEach(function(e){
        console.log(e)
      }))
      console.log(Array.isArray($scope.people)) //true
      console.log($scope.people)
  
   
  
    }
  
  
  })</code></pre>
  </div>
  </div>
  </p>
  
  <p>Here is the HTML:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="centerText"&gt;
    &lt;h3&gt;{{person.username}}&lt;/h3&gt;
    &lt;p&gt;{{person.fullname.join(' ')}}&lt;/p&gt;
    &lt;h5&gt;{{person.email}}&lt;/h5&gt;
    &lt;button class="btn btn-success" ng-click="addFriend(person,$index)"&gt;Friend me&lt;/button&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>