Modify array in Angular does not work

I am getting $scope.persons from a back end. I list it using ng-repeat.

Why will the array not be modified in my case when $scope.openDeleteModal is called?

The function is called but nothing happens to $scope.persons. Why?

application.controller('listPersonController', function ($scope, personService) {
   personService.getPersons()
  .then(function(persons) {
      $scope.persons = persons;
  });

  $scope.openDeleteModal = function (personId, firstname, lastname, index) {
    console.log("click " + $scope.persons.length);
    $scope.persons.splice();
    console.log("click " + $scope.persons.length);
  };
});

Edit:

OK I forget about splice. I use this instead

 $scope.openDeleteModal = function (personId, firstname, lastname, index) {
    console.log("click " + $scope.persons.length);
    $scope.persons = [];
    console.log("click " + $scope.persons.length);
  };

The first one logs 3. The second 0. But I do not see any changes on the scope(ng-repeat).

The HTML:

<tbody>
   <tr ng-repeat="p in persons">
      <td>{{p.firstname}}</td>
      <td>{{p.lastname}}</td>
      <td><a href="#/register_person/{{p.id}}" class="tiny button radius" >Edit</a></td>
      <td>
        <a href="#" 
           ng-click="openDeleteModal(p.id, p.firstname, p.lastname, $index)"
           class="tiny button alert radius">Delete</a>
      </td>
   </tr>  
</tbody>

The service:

personService.getPersons = function($scope){
   var promise = $http.get("rest/person").then(function (response) {
        return response.data;
   });
   return promise;
};

This is what {{persons}} just under the controller gives

[{"id":"5331c6f33004e1c8a26492a8","firstname":"Karl","lastname":"Svensson"},{"id":"5331dfdb3004e1c8a26492ad","firstname":"Jenny","lastname":"Bertilsson"},{"id":"5331ee4e3004e1c8a26492ae","firstname":"Bosse","lastname":"Gustavsson"}]

This does not change either when I modify the scope

Edit Trying to simplify stuff even more.

application.controller('listPersonController', function ($scope, personService) {

  var personsList =  [{"id":"5331dfdb3004e1c8a26492ad","firstname":"Johnny","lastname":"Bravo"}];

  $scope.persons = personsList;

  $scope.openDeleteModal = function (personId, firstname, lastname, index) {
    console.log("click " + $scope.persons.length);
    $scope.persons.length = 0;
    personsList.length = 0;
    console.log("click " + $scope.persons.length);
  };
});

Edit: The html is super simple now

<div class="row" ng-controller="listPersonController" >
    <p ng-repeat="p in persons">{{p.firstname}} <a href="#" class="tiny button alert radius" ng-click="openDeleteModal(p.id, p.firstname, p.lastname, $index)" >Delete</a></p>
</div>

Even more simple. The value of var is 3 on my page and it does not get updated on click.

application.controller('listPersonController', function ($scope, personService) {

  $scope.var = "1";

  $scope.openDeleteModal = function () {
    $scope.var = "2";
  };

   $scope.var = "3";
});

Edit: Code works as expected when moved out from ng-view. Why is this happening?