Angularjs not updating using alertify or dialog plugin

Question

i'm using angular.js and alertify.js to list user in here:

Plunkr

the problem is : after I click the delete menu, a confirmation window appears, then after OK button clicked, the deleted row still there until you click Delete button again.

It seems, Angular doesn't know when to update itself. Anyone know How to 'reload' this user table properly in Angular?

here's my html file:

 <table class="table">
   <tbody>
    <tr ng-repeat="user in users">
      <td>{{ user.name }}</td>
      <td>{{ user.age }}</td>
      <td>
        <button class="btn btn-danger" ng-click="removeUser($index)">
          Delete
        </button>
      </td>
    </tr>
  </tbody>
</table>

here's my function app.js :

var app = angular.module('demo', []);

app.controller('DemoCtrl', function($scope, $http) {
$scope.users = [
   {name: "Jack", age: 10}, 
   {name: "Bart",age: 20}, 
   {name: "Griffin",age: 40}]

$scope.removeUser = function(index) {
  alertify.confirm("You Sure ?").set('onok', function() {
    $scope.users.splice(index, 1)
  })
 }
});

Answer 1

You can use $scope.$apply() to notify Angular about the changes you made in the context of alertify:

$scope.$apply(function() {
    $scope.users.splice(index, 1)
});

Updated Plnkr