Skip to content

Instantly share code, notes, and snippets.

@joanllenas
Created February 11, 2018 23:46
Show Gist options
  • Save joanllenas/f8b1e136e03030f28069414efa01389a to your computer and use it in GitHub Desktop.
Save joanllenas/f8b1e136e03030f28069414efa01389a to your computer and use it in GitHub Desktop.
Boolean approach template - Slaying a UI Antipattern with Angular
<div class="pure-u-1-1" *ngIf="service.state.isLoading">
<p class="loading">
Loading...
</p>
</div>
<div class="pure-u-1-1" *ngIf="!service.state.isLoading && !service.state.error && service.state.data">
<p>
Sunrise: {{ service.state.data.sunrise }}<br>
Sunset: {{ service.state.data.sunset }}
</p>
</div>
<div class="pure-u-1-1" *ngIf="!service.state.isLoading && service.state.error">
<p class="error">
Error: {{ service.state.error }}
</p>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment