"Implementing an AngularJS factory that returns a State object instead of typical JSON data fetched from

Question

"Implementing an AngularJS factory that returns a State object instead of typical JSON data fetched from

I have created two factories and I am calling the first one from the second one in my controller. However, instead of receiving JSON data, I am getting data as $$State. I am new to AngularJS and have tried multiple solutions but have not been able to resolve this issue. Can someone please assist me with this problem?

 app.factory('userDetails', ['APIService', '$q', function (APIService, $q) {
    getDetails: function () {
        var deferred = $q.defer();
        var getFunc = function () {
            APIService.doGetCall('Masters/employee/username/tarun')
                .then(
                function (data)
                { 
                    deferred.resolve(data);
                },
                function (data, status, headers, config)
                { 
                    deferred.reject('There was an error creating object'); })
                    return deferred.promise;
                 }
        var a = getFunc();
        return a;

    }
}

 vm.user = userDetails.getDetails();
console.log("user",vm.user);

The response is shown in the following snippet:

Response

javascript angularjs json angular-promise

Answer 1

Answer №1

To obtain a response, it is advisable to utilize the .then function. Creating an additional promise is considered an anti-pattern, as you can directly use the promise returned by the doGetCall method.

app.factory('userDetails', ['APIService', '$q', function(APIService, $q) {
  getDetails: function() {
    var getFunc = function() {
      return APIService.doGetCall('Masters/employee/username/tarun');
    }
    var a = getFunc();
    return a;
  }
}]);

vm.user = userDetails.getDetails().then(function(response){
    console.log(response.data);
    vm.user = response.data;
    console.log("user", vm.user);
}, function(error){
    console.log(error)
}).catch(exceptionHandler);

Answer 2

To obtain a response, it is advisable to utilize the .then function. Creating an additional promise is considered an anti-pattern, as you can directly use the promise returned by the doGetCall method.

app.factory('userDetails', ['APIService', '$q', function(APIService, $q) {
  getDetails: function() {
    var getFunc = function() {
      return APIService.doGetCall('Masters/employee/username/tarun');
    }
    var a = getFunc();
    return a;
  }
}]);

vm.user = userDetails.getDetails().then(function(response){
    console.log(response.data);
    vm.user = response.data;
    console.log("user", vm.user);
}, function(error){
    console.log(error)
}).catch(exceptionHandler);

Answer 3

Answer №2

When calling userDetails.getDetails(), keep in mind that it returns a promise. Therefore, you must utilize the .then(onsuccess, onRejected) method.

userDetails.getDetails().then(function(data){
   vm.user = data;
   console.log("user",vm.user);
});

Answer 4

When calling userDetails.getDetails(), keep in mind that it returns a promise. Therefore, you must utilize the .then(onsuccess, onRejected) method.

userDetails.getDetails().then(function(data){
   vm.user = data;
   console.log("user",vm.user);
});

Answer 5

Answer №3

Make sure to move the

return deferred.promise;

line outside of the APIService.doGetCall function and put it at the end instead.

Answer 6

Make sure to move the

return deferred.promise;

line outside of the APIService.doGetCall function and put it at the end instead.

"Implementing an AngularJS factory that returns a State object instead of typical JSON data fetched from

Answer №1

Answer №2

Answer №3

Similar questions

The script remains static and does not alter the "href" or "div" content based on the current URL

I'm unsure of my recollection on how to utilize the /* syntax in JavaScript

"Exploring the power of Node.js by utilizing ObjectArray and implementing

Tips for preventing the colors of all buttons from changing when only one is clicked in JavaScript

Issue with Jquery Slider Showing Empty Slide

Using Angular 8, remember to not only create a model but also to properly set it

Tips for retaining user input in an input box using HTML and AngularJS

Is the navigation dropdown toggle triggered by both mouseout and when hovering off of it?

Dynamically loading a JSON file in JavaScript

Handling invalid unicode characters in JSON with Golang Decoding/Unmarshaling

Are web components capable of managing changes in CSS (maybe through cssChangedCallback)?

Triggering server-side code (node.js) by clicking a button in an HTML page created with Jade

Adjust the value of a select box to the chosen option using JQuery

How can PHP Curl be used to retrieve a corresponding value from a JSON data?

Maintain functionality of React components even when they are not actively displayed

Reactjs is having issues with Datatable functions

Use nodejs with multer alongside angularjs to enable smooth file uploads without any redirection

Establish the state as the result of a function

What causes the variable to be invisible in the imported file?

Guide to sending back a promise using JQuery