AngularJS: UI Router resolve with $resource
Long time no see! It really has been long since last time I post on this topic. That’s because I’ve been working on the “real New 1A23”, I was rewriting the entire CMS on my own. Front-end and back-end. Anyway, this time, there’s a my solution to one of the problems I found: Compatibility between
UI-Router is a famous routing module for single-page app routing with AngularJS. In its state manager, the resolve feature allows external resources, especially AJAX requests to be loaded in dependence order before the view is rendered. However, in the official documentation, only examples for
$http is given. If you tried to return a the result of
$resource directly, you will find that the controller is actually called before the external resource is resolved. For those resource that depends on others, it will just fail silently.
UI-router utilising AngularJS’s Promise object to manage and process async requests, and enqueue it in a queue. For any requests that is done async-ly, it should return a promise object in the resolve tree.
It’s simple, you can return
.$promise from the resource request. Example code:
Yes, as simple as that. BTW, Jitaku works like a charm!