Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise

I have a Service which uses $resource to pull in API data. I want to included a isLoaded variable to define whether the API response has executed.

My service currently looks like this:

    app.factory('PlayerService', ['$resource', function($resource) {

      return $resource(
        'http://api/endpoint', {player_id: "@player_id"}
      )

}]);

I want to add functionality something like this (pseudocode)...

    app.factory('PlayerService', ['$resource', function($resource) {

      $scope.isLoaded = false;

      return $resource(
        'http://api/endpoint', {player_id: "@player_id"}
      )

      $scope.isLoaded = "true";

}]);

...but I'm struggling with the syntax. Do I need to write a separate function? Does this logic need to be contained in the controller as opposed to the service?

Any help appreciated.

share|improve this question

There is no need to add a isLoaded variable.

There is a $resolved method in $resourse service which does what you're trying to do. See documentation on https://docs.angularjs.org/api/ngResource/service/$resource :

$resolved: true after first server interaction is completed (either with success or rejection), false before that. Knowing if the Resource has been resolved is useful in data-binding.

example :

var test = $resource('http://api/endpoint', {player_id: "@player_id"});
test.get(function(result) {
    console.log(result.$resolved);
});

The result.$resolved will be true after the data is loaded. It will remain false if the data didn't load.

share|improve this answer
    
That looks like just what I'm after, but the documentation is very thin. How do you implement it? Would you include it in the service if this is where $resource is invoked? – Paulos3000 14 hours ago
    
I edited my answer with an example. The $resolved is invoked on the promise (result) from the $resource call (see example). Hope this will help. – Tom Shen 13 hours ago

This is alternative way to use loader for your app:

Use this feature of angular : $http.pendingRequests

My controller:

$rootScope.loaderExceptionCount = 0 ;
    $scope.isAnythingLoading = function() {
        console.log($http.pendingRequests, $http);
        return $http.pendingRequests.length > $rootScope.loaderExceptionCount;
    };

Here is your HTML code, where isAnythingLoading() is getting called:

<div ng-show="isAnythingLoading()" class="pageLoader">
        <div class="loaderBackdrop"></div>
            <div class="sk-wave">
                    <div class="sk-rect sk-rect1"></div>
                    <div class="sk-rect sk-rect2"></div>
                    <div class="sk-rect sk-rect3"></div>
                    <div class="sk-rect sk-rect4"></div>
                    <div class="sk-rect sk-rect5"></div>
            </div>
        </div>
<div ui-view=""></div>
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.