Angular JS success callback

Question

I m reaching out to you to get assistance on the $promise issue with AngularJS.

Here is the documentation information on $resource and it will be applicable to $http as

Answer 1

First i see a design problem, your factory shouldn't return resources, should return promises,

myservice.factory('empFactory', function ($resource) {

  var employeeResource  = $resource('../../Employee/GetEmployee/:EmpID', { EmpID: '@EmpID'}, {show: { method: 'GET' } }),
  updateResource = $resource('../../Employee/PutEmployee/:EmpID', { EmpID: '@EmpID', empval: '@empl' }, { update: { method: 'PUT', isArray: true } }),
  deleteResource = $resource('../../Employee/DeleteEmployee/:EmpID', { EmpID: '@EmpID' }, { del: { method: 'DELETE', isArray: true } }),
  createResource = $resource('../../Employee/CreateEmployee', { empval: '@empl' }, { create: { method: 'POST', isArray: true } });

  return { 
    getEmployee: function(id){
      return employeeResource.get({EmpID: id}).$promise;
    },
    updateEmployee: function(){
      return updateResource.update(...).$promise;
    }
  };
});

I think that the problem is that you are calling

$scope.Employee = empFactory.employee.show({ EmpID: $routeParams.EmpID });

This returns a resource right now, so you are not technically obtaining the employee anywhere. Is not very clear where is the error, are you trying to execute several resource request in parallel? if that's it use $q.all([asyncCall1,asyncCall2,...]).spread(function(r1, r2, ...) {...});

Regards

Answer 2

With $resource you define the API route and the parameters the API needs in order to process the request. Then, later you will need to supply the $resource with data and perform an action (get, save, query, remove, delete).

I personally prefer to work with $http as it's pretty cut and dry. The down-side is you can't pre-define the routes and parameters across your app.

Here's a pen that shows you both $resource and $http requests.

http://codepen.io/kenhowardpdx/pen/BNzXeE

angular.module('app', ['ngResource']);

MyService.$inject = ['$http', '$resource'];
function MyService ($http, $resource) {
    var _this = this;

    var Search = $resource('http://www.omdbapi.com/?tomatoes=true&plot=full&t=:searchTerm', {searchTerm:'@searchTerm'});

    _this.httpSearch = function (searchTerm) {
        return $http.get('http://www.omdbapi.com/?tomatoes=true&plot=full&t=' + searchTerm);
    };

    _this.resourceSearch = function (searchTerm) {
        return Search.get({searchTerm: searchTerm}).$promise;
    }
}

angular.module('app').service('MyService', MyService);

MyController.$inject = ['MyService'];
function MyController (MyService) {
    var _this = this;

    _this.type = 'http';

    _this.searchFilms = function () {
        if (_this.type === 'http') {
            MyService.httpSearch(_this.searchTerm).then(function(_response) {
               _this.results = _response.data; 
            });
        } else {
            MyService.resourceSearch(_this.searchTerm).then(function(_response) {
               _this.results = _response; 
            });
        }
    }
}

angular.module('app').controller('MyController', MyController);`

Answer 3

factory does not need to return a promise.I mean that depends on how you manage your factory and controllers and how you are going to resolve it.

your factory does not return a promise but resource, so it should be resolved in your controller. your update method in controller should be like this :

    $scope.UpdateEmp = function () {
    var empl = $scope.Employee;
    empFactory.empUpdate.update({ EmpID: $routeParams.EmpID, empval: empl }, function (successResponse) { // update method in my resource uses $resource
        $location.path('/EmpList'); //redirect to list
    },function (error) { 
     // do something on error callback
    });

read about angularjs resource angularjs docs about $resource