Show a loader

Author: bretmorris

src/app/app.component.html

@@ -1,4 +1,5 @@
 <a (click)="getEntries()">Get All Entries</a> | <a (click)="getEntries({include: 1})">Query Entries</a> | <a (click)="getEntry('651CQ8rLoIYCeY6G0QG22q', {include: 1})">Get entry</a>
+<div *ngIf="l">Loading...</div>
 <pre>
   {{r | json}}
 </pre>

src/app/app.component.ts

@@ -8,14 +8,23 @@ import { ContentfulService } from './modules/contentful/contentful.service';
 })
 export class AppComponent {
   r: any;
+  l = false;
 
   constructor(private cs: ContentfulService) {}
 
   getEntries(query?: any) {
-    this.cs.getEntries(query).then(res => this.r = res);
+    this.l = true;
+    this.cs.getEntries(query).then(res => {
+      this.r = res;
+      this.l = false;
+    });
   }
 
   getEntry(id: string, query?: any) {
-    this.cs.getEntry(id, query).then(res => this.r = res);
+    this.l = true;
+    this.cs.getEntry(id, query).then(res => {
+      this.r = res;
+      this.l = false;
+    });
   }
 }