how to cancel a promise with $resource in angularjs in 1.5

Question

I'm using angular 1.5.7 and would like to cancel a delete on a resource if it takes time. I'm using a MEAN stack and sometimes I see the delete on my resource seen as pending (is it mongo which is slow ?). Below is the factory and the snippet from the controller where I call the delete: * the factory:

      .factory('addressesFactory', ['$resource', 'baseURL', function ($resource, baseURL) {
    return $resource(baseURL + 'addresses/:id', {id: '@_id'}, {
      'update': {
        method: 'PUT'
      },
      'delete': {
        method: 'DELETE'
      }
    });
  }])

the snippet from the controller:

$scope.delete = function (address, addressesList) {

$scope.deleteDisabled=true;

console.log('[ModeratorsCtrl] Deleting:' + address.name);
console.log('[ModeratorsCtrl] ' + addressesList.length);
addressesFactory.delete({id: address._id}).$promise.then(
  function (response) {
    $scope.deleteDisabled=false;
    console.log('[ModeratorsCtrl] Address deleted successfully');
  },
  function (response) {
    $scope.deleteDisabled=false;
    var message = '[ModeratorsCtrl] Error: ' + response.status + ' ' + response.statusText;
    console.log(message);
  }
);

};

I saw this post How to cancel $resource requests and read this about cancelling requests: https://docs.angularjs.org/api/ngResource/service/$resource#! with $cancelRequest() but I'm a bit confused. Can anyone give me the best practices on how I can cancel a promise in my implementation ? Regards,

this one more up to date: http://stackoverflow.com/questions/35066781/angularjs-cancelrequest-not-available-in-resource — gyc, Aug 10 '16 at 06:23
thanks for the link any idea on how to use the $cancelRequest() in my case ? — tuxmobil, Aug 10 '16 at 07:56

score 1 · Accepted Answer · answered Aug 10 '16 at 08:00

1

lets say your resource is Users, to cancel the request, you should name your action e.g

var request = Users.query();

at this point ```request is a promise. you can simply do a,

request.$cancelRequest();

to cancel.

answered Aug 10 '16 at 08:00

Yousuf Jawwad

3,037
7
33
60

ok thanks I'll give a try I guess I have to perform such call after the delete call in my controller with: addressesFactory.$cancelRequest(); assuming I set cancellable: true in my factory – tuxmobil Aug 10 '16 at 08:06
1

Make sure you set `cancellable: true` on the resource via the [options](https://docs.angularjs.org/api/ngResource/service/$resource) or the `$cancelRequest()` method won't be exposed. – seangwright Jul 11 '17 at 13:45

score 0 · Answer 2 · answered Aug 10 '16 at 11:17

thanks for the help I ended up by doing the following in my factory:

  .factory('addressesFactory', ['$resource', 'baseURL', function ($resource, baseURL) {
    return $resource(baseURL + 'addresses/:id', {id: '@_id'}, {
      'update': {
        method: 'PUT'
      },
      'delete': {
        method: 'DELETE',
        cancellable: true
      }
    });
  }])

then this in my controller:

 $scope.delete = function (address, addressesList) {
    $scope.deleteDisabled = true;//prevent multiple click

    var deleteRequest = addressesFactory.delete({id: address._id});
    deleteRequest.$promise.then(
      function (response) {
        $scope.deleteDisabled = false;
        console.log('[ModeratorsCtrl] Address deleted successfully');
      },
      function (response) {
        $scope.deleteDisabled = false;
        var message = '[ModeratorsCtrl] Error: ' + response.status + ' ' + response.statusText;
        console.log(message);
      }
    );

    $timeout(function () {//2 seconds then cancel the promise
      if ($scope.deleteDisabled === true) {
        console.log('[ModeratorsCtrl] Cancel ...');
        deleteRequest.$cancelRequest();
        $scope.deleteDisabled = false;
      }
    }, 2000);
  };

Hope this sticks to the best practices, feel free to give your feed back.

how to cancel a promise with $resource in angularjs in 1.5

2 Answers2