Angular Fullstack - delete confirmation modal example

admin.controller.es6

'use strict';

(function() {

class AdminController {
  constructor(User, Modal) {
    // Use the User $resource to fetch all users
    this.users = User.query();

    // Our callback function is called if/when the delete modal is confirmed
    this.delete = Modal.confirm.delete(user => {
      user.$remove();
      this.users.splice(this.users.indexOf(user), 1);
    });
  }
}

angular.module('myApp.admin')
  .controller('AdminController', AdminController);

})();

admin.controller.js

'use strict';

angular.module('myApp')
  .controller('AdminCtrl', function($scope, Auth, User, Modal) {

    // Use the User $resource to fetch all users
    $scope.users = User.query();

    // Our callback function is called if/when the delete modal is confirmed
    $scope.delete = Modal.confirm.delete(function(user) {
      User.remove({ id: user._id });
      angular.forEach($scope.users, function(u, i) {
        if (u === user) {
          $scope.users.splice(i, 1);
        }
      });
    });
  });

admin.html

<div ng-include="'components/navbar/navbar.html'"></div>

<div class="container">
  <p>The delete user and user index api routes are restricted to users with the 'admin' role.</p>
  <ul class="list-group">
    <li class="list-group-item" ng-repeat="user in users">
        <strong>{{user.name}}</strong><br>
        <span class="text-muted">{{user.email}}</span>
        <!-- Our delete modal takes a string as the first arg (used to display what we are deleting) 
        all other args are passed to the callback defined in admin.controller.js -->
        <a ng-click="delete(user.name, user)" class="trash"><span class="glyphicon glyphicon-trash pull-right"></span></a>
    </li>
  </ul>
</div>

When updating UI-Bootstrap(by any reason) you should change the $modal by $uibModal in the Modal factory dependency injection