Skip to content

Instantly share code, notes, and snippets.

@justinwinslow
Last active December 31, 2015 02:59
Show Gist options
  • Save justinwinslow/7924701 to your computer and use it in GitHub Desktop.
Save justinwinslow/7924701 to your computer and use it in GitHub Desktop.
Loading and no items indication for angular
<!-- This assumes you are using ngResource to request data (http://docs.angularjs.org/api/ngResource.$resource) -->
<ul>
<!--
We can use ng-show="{expression}" to programmatically display something.
ngResouce adds a handy $resolved property to your data objects.
So, let's key off of that to indicate loading
-->
<li ng-show="!things.$resolved">Loading...</li>
<!--
If $resolved is true, the request has returned.
So, $resolved being true, let's make sure we have models
-->
<li ng-show="things.$resolved && things.length === 0">No things</li>
<!-- Finally, use the angular repeater to build the list of model views -->
<li ng-repeat="thing in things">{{ thing }}</li>
</ul>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment