How does the $resource `get` function work synchronously in AngularJS?

by

$resource is not synchronous although this syntax might suggest that it is:

$scope.twitterResult = $scope.twitter.get();

What is going on here is that call to the AngularJS will, after call to twitter.get(), return immediately with the result being an empty array. Then, when the async call is finished and real data arrives from the server, the array will get updated with data. AngularJS will simply keep a reference to an array returned and will fill it in when data are available.

Here is the fragment of $resource implementation where the “magic” happens: https://github.com/angular/angular.js/blob/master/src/ngResource/resource.js#L372

This is described in the $resource documentation as well:

It is important to realize that invoking a $resource object method immediately returns an empty reference (object or array depending on isArray). Once the data is returned from the server the existing reference is populated with the actual data. This is a useful trick since usually the resource is assigned to a model which is then rendered by the view. Having an empty object results in no rendering, once the data arrives from the server then the object is populated with the data and the view automatically re-renders itself showing the new data. This means that in most case one never has to write a callback function for the action methods.

More Related Contents:

  1. simple form input request in angular
  2. How does data binding work in AngularJS?
  3. What are the nuances of scope prototypal / prototypical inheritance in AngularJS?
  4. Controller not a function, got undefined, while defining controllers globally
  5. How can I group data with an Angular filter?
  6. How do I share $scope data between states in angularjs ui-router?
  7. $on and $broadcast in angular
  8. AngularJS : Difference between the $observe and $watch methods
  9. How to validate inputs dynamically created using ng-repeat, ng-show (angular)
  10. AngularJS – How to use $routeParams in generating the templateUrl?
  11. Does never resolved promise cause memory leak?
  12. Failed to execute ‘postMessage’ on ‘DOMWindow’: https://www.youtube.com !== http://localhost:9000
  13. How to compare two objects and get key-value pairs of their differences?
  14. How to make ng-bind-html compile angularjs code
  15. How to get the difference of two dates in mm-dd-hh format in Javascript
  16. Watch multiple $scope attributes
  17. How to filter array when object key value is in array
  18. Image loaded event in for ng-src in AngularJS
  19. Can Protractor and Karma be used together?
  20. How to set default browser window size in Protractor/WebdriverJS
  21. Sort an object array by custom order
  22. How to use parameters within the filter in AngularJS?
  23. Dynamic form name attribute in Angularjs
  24. How can I access a variable outside a promise `.then` method?
  25. random orderBy in AngularJS 1.2 returns ‘infdig’ errors
  26. Limiting number of displayed results when using ngRepeat
  27. AngularJS – placeholder for empty result from filter
  28. Dynamically assign ng-model
  29. Accessing Angular inside Protractor Test
  30. AngularJS and WebSockets beyond

Leave a Comment