From f398b3a9454a06bf7ccb37f4b62b9819b9266469 Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.mtza@gmail.com>
Date: Tue, 13 Mar 2018 21:22:49 +0100
Subject: [PATCH] fix(demos): fixes angular

---
 angular/src/providers/modal-controller.ts     |  2 +-
 angular/src/util/util.ts                      |  2 +-
 .../action-sheet-page.component.ts            |  6 +-
 .../src/app/alert/alert-page.component.ts     | 18 +----
 demos/angular/src/app/app-routing.module.ts   |  5 --
 demos/angular/src/app/app.module.ts           |  3 +-
 .../src/app/badge/badge-page.component.ts     |  2 -
 .../src/app/card/card-page.component.ts       |  2 -
 .../src/app/content/content-page.component.ts |  2 -
 .../form-sample-page.component.html           |  2 -
 .../src/app/loading/loading-page.component.ts |  8 +-
 .../src/app/modal/modal-page-to-present.ts    |  2 -
 .../src/app/modal/modal-page.component.ts     |  6 +-
 .../login/login-routing.module.ts             | 14 ----
 .../app/nav-then-tabs/login/login.module.ts   | 17 -----
 .../src/app/nav-then-tabs/login/login.ts      | 38 ----------
 .../nav-then-tabs-routing.module.ts           | 21 -----
 .../nav-then-tabs/nav-then-tabs.component.ts  | 15 ----
 .../app/nav-then-tabs/nav-then-tabs.module.ts | 21 -----
 .../tab-one-page-one-routing.module.ts        | 14 ----
 .../tab-one-page-one.module.ts                | 17 -----
 .../tab-one-page-one/tab-one-page-one.ts      | 34 ---------
 .../tab-one-page-three-routing.module.ts      | 14 ----
 .../tab-one-page-three.module.ts              | 17 -----
 .../tab-one-page-three/tab-one-page-three.ts  | 34 ---------
 .../tab-one-page-two-routing.module.ts        | 14 ----
 .../tab-one-page-two.module.ts                | 17 -----
 .../tab-one-page-two/tab-one-page-two.ts      | 41 ----------
 .../tab-three-page-one-routing.module.ts      | 14 ----
 .../tab-three-page-one.module.ts              | 17 -----
 .../tab-three-page-one/tab-three-page-one.ts  | 34 ---------
 .../tab-three-page-three-routing.module.ts    | 14 ----
 .../tab-three-page-three.module.ts            | 17 -----
 .../tab-three-page-three.ts                   | 34 ---------
 .../tab-three-page-two-routing.module.ts      | 14 ----
 .../tab-three-page-two.module.ts              | 17 -----
 .../tab-three-page-two/tab-three-page-two.ts  | 41 ----------
 .../tab-two-page-one-routing.module.ts        | 14 ----
 .../tab-two-page-one.module.ts                | 17 -----
 .../tab-two-page-one/tab-two-page-one.ts      | 34 ---------
 .../tab-two-page-three-routing.module.ts      | 14 ----
 .../tab-two-page-three.module.ts              | 17 -----
 .../tab-two-page-three/tab-two-page-three.ts  | 34 ---------
 .../tab-two-page-two-routing.module.ts        | 14 ----
 .../tab-two-page-two.module.ts                | 17 -----
 .../tab-two-page-two/tab-two-page-two.ts      | 41 ----------
 .../tabs-page/tabs-page-routing.module.ts     | 76 -------------------
 .../tabs-page/tabs-page.module.ts             | 52 -------------
 .../app/nav-then-tabs/tabs-page/tabs-page.ts  | 38 ----------
 .../nested-nav/nested-nav-routing.module.ts   | 22 ------
 .../app/nested-nav/nested-nav.component.ts    | 15 ----
 .../src/app/nested-nav/nested-nav.module.ts   | 21 -----
 .../page-one-routing.module.ts                | 14 ----
 .../nested-page-one/page-one.module.ts        | 17 -----
 .../nested-nav/nested-page-one/page-one.ts    | 36 ---------
 .../page-three-routing.module.ts              | 14 ----
 .../nested-page-three/page-three.module.ts    | 19 -----
 .../nested-page-three/page-three.ts           | 39 ----------
 .../page-two-routing.module.ts                | 29 -------
 .../nested-page-two/page-two-section-one.ts   | 43 -----------
 .../nested-page-two/page-two-section-two.ts   | 42 ----------
 .../nested-page-two/page-two.module.ts        | 32 --------
 .../nested-nav/nested-page-two/page-two.ts    | 24 ------
 .../no-routing-nav-routing.module.ts          | 14 ----
 .../no-routing-nav.component.ts               | 20 -----
 .../no-routing-nav/no-routing-nav.module.ts   | 31 --------
 .../src/app/no-routing-nav/pages/page-one.ts  | 64 ----------------
 .../app/no-routing-nav/pages/page-three.ts    | 65 ----------------
 .../src/app/no-routing-nav/pages/page-two.ts  | 75 ------------------
 .../src/app/popover/popover-page.component.ts |  6 +-
 .../src/app/segment/segment-page.component.ts |  2 -
 .../app/show-hide-when/show-hide-when.html    |  2 -
 .../page-one/page-one-routing.module.ts       | 14 ----
 .../simple-nav/page-one/page-one.module.ts    | 17 -----
 .../src/app/simple-nav/page-one/page-one.ts   | 40 ----------
 .../page-three/page-three-routing.module.ts   | 14 ----
 .../page-three/page-three.module.ts           | 19 -----
 .../app/simple-nav/page-three/page-three.ts   | 47 ------------
 .../page-two/page-two-routing.module.ts       | 17 -----
 .../simple-nav/page-two/page-two.module.ts    | 27 -------
 .../src/app/simple-nav/page-two/page-two.ts   | 39 ----------
 .../simple-nav/simple-nav-routing.module.ts   | 22 ------
 .../app/simple-nav/simple-nav.component.ts    | 15 ----
 .../src/app/simple-nav/simple-nav.module.ts   | 21 -----
 .../src/app/toast/toast-page.component.ts     |  6 +-
 .../virtual-scroll-page.component.ts          |  3 -
 86 files changed, 18 insertions(+), 1887 deletions(-)
 delete mode 100644 demos/angular/src/app/nav-then-tabs/login/login-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/login/login.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/login/login.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/nav-then-tabs-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/nav-then-tabs.component.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/nav-then-tabs.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page-routing.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.module.ts
 delete mode 100644 demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-nav-routing.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-nav.component.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-nav.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-one/page-one-routing.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-one/page-one.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-one/page-one.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-three/page-three-routing.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-three/page-three.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-three/page-three.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-two/page-two-routing.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-two/page-two-section-one.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-two/page-two-section-two.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-two/page-two.module.ts
 delete mode 100644 demos/angular/src/app/nested-nav/nested-page-two/page-two.ts
 delete mode 100644 demos/angular/src/app/no-routing-nav/no-routing-nav-routing.module.ts
 delete mode 100644 demos/angular/src/app/no-routing-nav/no-routing-nav.component.ts
 delete mode 100644 demos/angular/src/app/no-routing-nav/no-routing-nav.module.ts
 delete mode 100644 demos/angular/src/app/no-routing-nav/pages/page-one.ts
 delete mode 100644 demos/angular/src/app/no-routing-nav/pages/page-three.ts
 delete mode 100644 demos/angular/src/app/no-routing-nav/pages/page-two.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-one/page-one-routing.module.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-one/page-one.module.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-one/page-one.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-three/page-three-routing.module.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-three/page-three.module.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-three/page-three.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-two/page-two-routing.module.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-two/page-two.module.ts
 delete mode 100644 demos/angular/src/app/simple-nav/page-two/page-two.ts
 delete mode 100644 demos/angular/src/app/simple-nav/simple-nav-routing.module.ts
 delete mode 100644 demos/angular/src/app/simple-nav/simple-nav.component.ts
 delete mode 100644 demos/angular/src/app/simple-nav/simple-nav.module.ts

diff --git a/angular/src/providers/modal-controller.ts b/angular/src/providers/modal-controller.ts
index 2d569d532e..6a231ce011 100644
--- a/angular/src/providers/modal-controller.ts
+++ b/angular/src/providers/modal-controller.ts
@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { ModalOptions } from '@ionic/core';
 import { OverlayBaseController } from '../util/overlay';
-import { AngularDelegate } from '..';
+import { AngularDelegate } from './angular-delegate';
 
 @Injectable()
 export class ModalController extends OverlayBaseController<ModalOptions, HTMLIonModalElement> {
diff --git a/angular/src/util/util.ts b/angular/src/util/util.ts
index f84b3385de..0012c7475d 100644
--- a/angular/src/util/util.ts
+++ b/angular/src/util/util.ts
@@ -2,7 +2,7 @@
 export function proxyMethod(ctrlName: string, methodName: string, ...args: any[]) {
   const controller = ensureElementInBody(ctrlName);
   return controller.componentOnReady()
-    .then(() => (controller as any)[methodName].apply(args));
+    .then(() => (controller as any)[methodName].apply(controller, args));
 }
 
 export function ensureElementInBody(elementName: string) {
diff --git a/demos/angular/src/app/action-sheet/action-sheet-page.component.ts b/demos/angular/src/app/action-sheet/action-sheet-page.component.ts
index a0b3f4609b..c970ccdf61 100644
--- a/demos/angular/src/app/action-sheet/action-sheet-page.component.ts
+++ b/demos/angular/src/app/action-sheet/action-sheet-page.component.ts
@@ -6,7 +6,6 @@ import { ActionSheetController } from '@ionic/angular';
   selector: 'app-action-sheet-page',
   template: `
   <ion-app>
-  <ion-page class="show-page">
     <ion-header>
       <ion-toolbar>
         <ion-title>Test</ion-title>
@@ -15,7 +14,6 @@ import { ActionSheetController } from '@ionic/angular';
     <ion-content padding>
       <ion-button (click)="clickMe()">Open Basic ActionSheet</ion-button>
     </ion-content>
-  </ion-page>
 </ion-app>
   `
 })
@@ -25,8 +23,8 @@ export class ActionSheetPageComponent {
 
   }
 
-  clickMe() {
-    const actionSheet = this.actionSheetController.create({
+  async clickMe() {
+    const actionSheet = await this.actionSheetController.create({
       title: 'Albums',
       buttons: [{
         text: 'Delete',
diff --git a/demos/angular/src/app/alert/alert-page.component.ts b/demos/angular/src/app/alert/alert-page.component.ts
index 754bc15f6a..c68a635323 100644
--- a/demos/angular/src/app/alert/alert-page.component.ts
+++ b/demos/angular/src/app/alert/alert-page.component.ts
@@ -6,7 +6,6 @@ import { AlertController } from '@ionic/angular';
   selector: 'app-alert-page',
   template: `
   <ion-app>
-  <ion-page class="show-page">
     <ion-header>
       <ion-toolbar>
         <ion-title>Test</ion-title>
@@ -15,18 +14,15 @@ import { AlertController } from '@ionic/angular';
     <ion-content padding>
       <ion-button (click)="clickMe()">Open Basic Alert</ion-button>
     </ion-content>
-  </ion-page>
 </ion-app>
   `
 })
 export class AlertPageComponent {
 
-  constructor(private alertController: AlertController) {
+  constructor(private alertController: AlertController) {}
 
-  }
-
-  clickMe() {
-    const alert = this.alertController.create({
+  async clickMe() {
+    const alert = await this.alertController.create({
       title: 'ohhhh snap',
       message: 'Ive been injected via Angular keeping the old api',
       buttons: [
@@ -45,14 +41,8 @@ export class AlertPageComponent {
           }
         }
       ]
-
-    });
-    alert.present().then(() => {
-      // return alert.dismiss();
-
-    }).then(() => {
-      console.log('dismissed');
     });
+    return alert.present();
   }
 
 }
diff --git a/demos/angular/src/app/app-routing.module.ts b/demos/angular/src/app/app-routing.module.ts
index 9d80e39b1d..41ea04bdbb 100644
--- a/demos/angular/src/app/app-routing.module.ts
+++ b/demos/angular/src/app/app-routing.module.ts
@@ -19,11 +19,6 @@ const routes: Routes = [
   { path: 'popover', loadChildren: 'app/popover/popover.module#PopoverModule' },
   { path: 'segment', loadChildren: 'app/segment/segment.module#SegmentModule' },
   { path: 'virtual-scroll', loadChildren: 'app/virtual-scroll/virtual-scroll.module#VirtualScrollModule' },
-
-  { path: 'no-routing-nav', loadChildren: 'app/no-routing-nav/no-routing-nav.module#NoRoutingNavModule' },
-  { path: 'simple-nav', loadChildren: 'app/simple-nav/simple-nav.module#SimpleNavModule' },
-  { path: 'nested-nav', loadChildren: 'app/nested-nav/nested-nav.module#NestedNavModule' },
-  { path: 'nav-then-tabs', loadChildren: 'app/nav-then-tabs/nav-then-tabs.module#NavThenTabsModule' },
 ];
 
 @NgModule({
diff --git a/demos/angular/src/app/app.module.ts b/demos/angular/src/app/app.module.ts
index ac8d401954..cd159c0a54 100644
--- a/demos/angular/src/app/app.module.ts
+++ b/demos/angular/src/app/app.module.ts
@@ -6,7 +6,7 @@ import { AppComponent } from './app.component';
 import { AppRoutingModule } from './app-routing.module';
 import { PostTestService } from './post-test/post-test.service';
 
-import { IonicAngularModule, IonicRouterModule } from '@ionic/angular';
+import { IonicAngularModule } from '@ionic/angular';
 
 @NgModule({
   declarations: [AppComponent],
@@ -15,7 +15,6 @@ import { IonicAngularModule, IonicRouterModule } from '@ionic/angular';
     BrowserModule,
     HttpClientModule,
     IonicAngularModule.forRoot(),
-    IonicRouterModule.forRoot()
   ],
   bootstrap: [AppComponent],
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
diff --git a/demos/angular/src/app/badge/badge-page.component.ts b/demos/angular/src/app/badge/badge-page.component.ts
index 9dfda92d81..c6c33e76f1 100644
--- a/demos/angular/src/app/badge/badge-page.component.ts
+++ b/demos/angular/src/app/badge/badge-page.component.ts
@@ -4,7 +4,6 @@ import { Component } from '@angular/core';
   selector: 'app-badge-page',
   template: `
   <ion-app>
-  <ion-page class="show-page">
     <ion-header>
       <ion-toolbar>
         <ion-title>Badges</ion-title>
@@ -71,7 +70,6 @@ import { Component } from '@angular/core';
         </ion-item>
       </ion-list>
     </ion-content>
-  </ion-page>
 </ion-app>
   `
 })
diff --git a/demos/angular/src/app/card/card-page.component.ts b/demos/angular/src/app/card/card-page.component.ts
index 251e2d732e..631099aa44 100644
--- a/demos/angular/src/app/card/card-page.component.ts
+++ b/demos/angular/src/app/card/card-page.component.ts
@@ -4,7 +4,6 @@ import { Component } from '@angular/core';
   selector: 'app-card-page',
   template: `
   <ion-app>
-  <ion-page class="show-page">
     <ion-header>
       <ion-toolbar>
         <ion-title>Card</ion-title>
@@ -57,7 +56,6 @@ import { Component } from '@angular/core';
         </ion-item>
       </ion-card>
     </ion-content>
-  </ion-page>
 </ion-app>
   `
 })
diff --git a/demos/angular/src/app/content/content-page.component.ts b/demos/angular/src/app/content/content-page.component.ts
index 27ed437d36..2bae0fa461 100644
--- a/demos/angular/src/app/content/content-page.component.ts
+++ b/demos/angular/src/app/content/content-page.component.ts
@@ -19,7 +19,6 @@ import { Component } from '@angular/core';
   ],
   template: `
   <ion-app>
-  <ion-page class="show-page">
   <ion-header #header>
     <ion-toolbar style="display: none" #toolbar>
       <ion-title>Hidden Toolbar</ion-title>
@@ -54,7 +53,6 @@ import { Component } from '@angular/core';
       <ion-title>Footer</ion-title>
     </ion-toolbar>
   </ion-footer>
-</ion-page>
 </ion-app>
   `
 })
diff --git a/demos/angular/src/app/form-sample-page/form-sample-page.component.html b/demos/angular/src/app/form-sample-page/form-sample-page.component.html
index 53b46c9d20..ca9ef492cf 100644
--- a/demos/angular/src/app/form-sample-page/form-sample-page.component.html
+++ b/demos/angular/src/app/form-sample-page/form-sample-page.component.html
@@ -1,6 +1,5 @@
 <ion-app>
   <form #myForm="ngForm">
-    <ion-page class="show-page">
       <ion-header>
         <ion-toolbar>
           <ion-title>Sample Form</ion-title>
@@ -85,6 +84,5 @@
         <ion-button expand="block" [disabled]="myForm.invalid" (click)="save(myForm.value)">
           <ion-icon name="save" slot="start"></ion-icon>Looks Good to Me</ion-button>
       </ion-footer>
-    </ion-page>
   </form>
 </ion-app>
diff --git a/demos/angular/src/app/loading/loading-page.component.ts b/demos/angular/src/app/loading/loading-page.component.ts
index 048b273142..77156642cc 100644
--- a/demos/angular/src/app/loading/loading-page.component.ts
+++ b/demos/angular/src/app/loading/loading-page.component.ts
@@ -6,7 +6,6 @@ import { LoadingController } from '@ionic/angular';
   selector: 'app-loading-page',
   template: `
   <ion-app>
-  <ion-page class="show-page">
     <ion-header>
       <ion-toolbar>
         <ion-title>Test</ion-title>
@@ -15,7 +14,6 @@ import { LoadingController } from '@ionic/angular';
     <ion-content padding>
       <ion-button (click)="clickMe()">Open Basic Loading</ion-button>
     </ion-content>
-  </ion-page>
 </ion-app>
   `
 })
@@ -25,12 +23,12 @@ export class LoadingPageComponent {
 
   }
 
-  clickMe() {
-    const loading = this.loadingController.create({
+  async clickMe() {
+    const loading = await this.loadingController.create({
       duration: 1000,
       content: 'Ahem. Please wait.'
     });
-    loading.present();
+    return loading.present();
   }
 
 }
diff --git a/demos/angular/src/app/modal/modal-page-to-present.ts b/demos/angular/src/app/modal/modal-page-to-present.ts
index a696e3ec45..b8d36fb6af 100644
--- a/demos/angular/src/app/modal/modal-page-to-present.ts
+++ b/demos/angular/src/app/modal/modal-page-to-present.ts
@@ -4,7 +4,6 @@ import { ModalController } from '@ionic/angular';
 @Component({
   selector: 'page-one',
   template: `
-<ion-page>
   <ion-header>
     <ion-toolbar>
       <ion-title>Page One</ion-title>
@@ -17,7 +16,6 @@ import { ModalController } from '@ionic/angular';
     </ul>
     <ion-button class="dismiss-btn" (click)="dismiss()">Close Modal</ion-button>
   </ion-content>
-</ion-page>
   `,
   encapsulation: ViewEncapsulation.None
 })
diff --git a/demos/angular/src/app/modal/modal-page.component.ts b/demos/angular/src/app/modal/modal-page.component.ts
index 699b6dd77f..011f41cc28 100644
--- a/demos/angular/src/app/modal/modal-page.component.ts
+++ b/demos/angular/src/app/modal/modal-page.component.ts
@@ -7,7 +7,6 @@ import { ModalPageToPresent } from './modal-page-to-present';
   selector: 'app-modal-page',
   template: `
   <ion-app>
-    <ion-page class="show-page">
       <ion-header>
         <ion-toolbar>
           <ion-title>Test</ion-title>
@@ -16,7 +15,6 @@ import { ModalPageToPresent } from './modal-page-to-present';
       <ion-content padding>
         <ion-button (click)="clickMe()">Open Basic Modal</ion-button>
       </ion-content>
-    </ion-page>
 </ion-app>,
   `,
   encapsulation: ViewEncapsulation.None
@@ -26,8 +24,8 @@ export class ModalPageComponent {
   constructor(private modalController: ModalController) {
   }
 
-  clickMe() {
-    const modal = this.modalController.create({
+  async clickMe() {
+    const modal = await this.modalController.create({
       component: ModalPageToPresent
     });
     return modal.present();
diff --git a/demos/angular/src/app/nav-then-tabs/login/login-routing.module.ts b/demos/angular/src/app/nav-then-tabs/login/login-routing.module.ts
deleted file mode 100644
index cf7ca97be3..0000000000
--- a/demos/angular/src/app/nav-then-tabs/login/login-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { LoginPage } from './login';
-
-const routes: Routes = [
-  { path: '', component: LoginPage}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class LoginRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/login/login.module.ts b/demos/angular/src/app/nav-then-tabs/login/login.module.ts
deleted file mode 100644
index 9fad36095d..0000000000
--- a/demos/angular/src/app/nav-then-tabs/login/login.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { LoginPage } from './login';
-import { LoginRoutingModule } from './login-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    LoginRoutingModule
-  ],
-  declarations: [LoginPage],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class LoginModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/login/login.ts b/demos/angular/src/app/nav-then-tabs/login/login.ts
deleted file mode 100644
index 62c8691b41..0000000000
--- a/demos/angular/src/app/nav-then-tabs/login/login.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'login',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Login Page</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Login - {{ts}}
-      <div>
-        <ion-button (click)="pushPageTwoComponent()">Login to app</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class LoginPage {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-
-  pushPageTwoComponent() {
-    this.navController.push('/nav-then-tabs/app/tabs/(tab-one:one)');
-  }
-
-
-
-}
diff --git a/demos/angular/src/app/nav-then-tabs/nav-then-tabs-routing.module.ts b/demos/angular/src/app/nav-then-tabs/nav-then-tabs-routing.module.ts
deleted file mode 100644
index d1e1135389..0000000000
--- a/demos/angular/src/app/nav-then-tabs/nav-then-tabs-routing.module.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { NavThenTabsPageComponent } from './nav-then-tabs.component';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: NavThenTabsPageComponent,
-    children: [
-      { path: 'login', loadChildren: './login/login.module#LoginModule' },
-      { path: 'app', loadChildren: './tabs-page/tabs-page.module#TabsPageModule' }
-    ]
-  }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class NavThenTabsRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/nav-then-tabs.component.ts b/demos/angular/src/app/nav-then-tabs/nav-then-tabs.component.ts
deleted file mode 100644
index dea3511214..0000000000
--- a/demos/angular/src/app/nav-then-tabs/nav-then-tabs.component.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'app-nav-page',
-  template: `
-<ion-app>
-  <ion-nav></ion-nav>
-</ion-app>
-  `
-})
-export class NavThenTabsPageComponent {
-  constructor() {
-  }
-
-}
diff --git a/demos/angular/src/app/nav-then-tabs/nav-then-tabs.module.ts b/demos/angular/src/app/nav-then-tabs/nav-then-tabs.module.ts
deleted file mode 100644
index 5b262ac11f..0000000000
--- a/demos/angular/src/app/nav-then-tabs/nav-then-tabs.module.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-
-import { NavThenTabsPageComponent } from './nav-then-tabs.component';
-import { NavThenTabsRoutingModule } from './nav-then-tabs-routing.module';
-
-import { IonicAngularModule, IonicRouterModule } from '@ionic/angular';
-
-@NgModule({
-  declarations: [
-    NavThenTabsPageComponent,
-  ],
-  imports: [
-    CommonModule,
-    IonicAngularModule,
-    IonicRouterModule,
-    NavThenTabsRoutingModule
-  ],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA]
-})
-export class NavThenTabsModule {}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one-routing.module.ts
deleted file mode 100644
index 497ee5094a..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabOnePageOne } from './tab-one-page-one';
-
-const routes: Routes = [
-  { path: '', component: TabOnePageOne}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabOnePageOneRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.module.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.module.ts
deleted file mode 100644
index ec32cdf16c..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabOnePageOne } from './tab-one-page-one';
-import { TabOnePageOneRoutingModule } from './tab-one-page-one-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabOnePageOneRoutingModule
-  ],
-  declarations: [TabOnePageOne],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabOnePageOneModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.ts
deleted file mode 100644
index fbeafdb9a6..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-one/tab-one-page-one.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-one-page-one',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab One Page One</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab One Page One {{ts}}
-      <div>
-        <ion-button (click)="next()">Go to Page Two</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabOnePageOne {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  next() {
-    this.navController.push('/nav-then-tabs/app/tabs/(tab-one:two)');
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three-routing.module.ts
deleted file mode 100644
index 7720330ea3..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabOnePageThree } from './tab-one-page-three';
-
-const routes: Routes = [
-  { path: '', component: TabOnePageThree}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabOnePageThreeRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.module.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.module.ts
deleted file mode 100644
index ed94b0e16a..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabOnePageThree } from './tab-one-page-three';
-import { TabOnePageThreeRoutingModule } from './tab-one-page-three-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabOnePageThreeRoutingModule
-  ],
-  declarations: [TabOnePageThree],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabOnePageThreeModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.ts
deleted file mode 100644
index 22060c7995..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-three/tab-one-page-three.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-one-page-three',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab One Page Three</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab One Page Three {{ts}}
-      <div>
-        <ion-button (click)="back()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabOnePageThree {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  back() {
-    this.navController.pop();
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two-routing.module.ts
deleted file mode 100644
index 44a965a932..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabOnePageTwo } from './tab-one-page-two';
-
-const routes: Routes = [
-  { path: '', component: TabOnePageTwo}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabOnePageTwoRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.module.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.module.ts
deleted file mode 100644
index a4cebff94f..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabOnePageTwo } from './tab-one-page-two';
-import { TabOnePageTwoRoutingModule } from './tab-one-page-two-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabOnePageTwoRoutingModule
-  ],
-  declarations: [TabOnePageTwo],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabOnePageTwoModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.ts b/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.ts
deleted file mode 100644
index 079d974c10..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-one-page-two/tab-one-page-two.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-one-page-two',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab One Page Two</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab One Page Two {{ts}}
-      <div>
-        <ion-button (click)="next()">Go to Page Three</ion-button>
-      </div>
-      <div>
-        <ion-button (click)="back()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabOnePageTwo {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  next() {
-    this.navController.push('/nav-then-tabs/app/tabs/(tab-one:three)');
-  }
-
-  back() {
-    this.navController.pop();
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one-routing.module.ts
deleted file mode 100644
index 0e08991d50..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabThreePageOne } from './tab-three-page-one';
-
-const routes: Routes = [
-  { path: '', component: TabThreePageOne}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabThreePageOneRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.module.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.module.ts
deleted file mode 100644
index ac8493f8cb..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabThreePageOne } from './tab-three-page-one';
-import { TabThreePageOneRoutingModule } from './tab-three-page-one-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabThreePageOneRoutingModule
-  ],
-  declarations: [TabThreePageOne],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabThreePageOneModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.ts
deleted file mode 100644
index 5cc8192051..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-one/tab-three-page-one.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-three-page-one',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab Three Page One</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab Three Page One {{ts}}
-      <div>
-        <ion-button (click)="next()">Go to Page Two</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabThreePageOne {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  next() {
-    this.navController.push('/nav-then-tabs/app/tabs/(tab-three:two)');
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three-routing.module.ts
deleted file mode 100644
index dad9208605..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabThreePageThree } from './tab-three-page-three';
-
-const routes: Routes = [
-  { path: '', component: TabThreePageThree}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabThreePageThreeRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.module.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.module.ts
deleted file mode 100644
index 57d2097774..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabThreePageThree } from './tab-three-page-three';
-import { TabThreePageThreeRoutingModule } from './tab-three-page-three-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabThreePageThreeRoutingModule
-  ],
-  declarations: [TabThreePageThree],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabThreePageThreeModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.ts
deleted file mode 100644
index 100411289d..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-three/tab-three-page-three.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-three-page-three',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab Three Page Three</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab Three Page Three {{ts}}
-      <div>
-        <ion-button (click)="back()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabThreePageThree {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  back() {
-    this.navController.pop();
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two-routing.module.ts
deleted file mode 100644
index ef0a749287..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabThreePageTwo } from './tab-three-page-two';
-
-const routes: Routes = [
-  { path: '', component: TabThreePageTwo}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabThreePageTwoRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.module.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.module.ts
deleted file mode 100644
index 91c76bc342..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabThreePageTwo } from './tab-three-page-two';
-import { TabThreePageTwoRoutingModule } from './tab-three-page-two-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabThreePageTwoRoutingModule
-  ],
-  declarations: [TabThreePageTwo],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabThreePageTwoModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.ts b/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.ts
deleted file mode 100644
index 0714107f0f..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-three-page-two/tab-three-page-two.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-three-page-two',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab Three Page Two</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab Three Page Two {{ts}}
-      <div>
-        <ion-button (click)="next()">Go to Page Three</ion-button>
-      </div>
-      <div>
-        <ion-button (click)="back()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabThreePageTwo {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  next() {
-    this.navController.push('/nav-then-tabs/app/tabs/(tab-three:three)');
-  }
-
-  back() {
-    this.navController.pop();
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one-routing.module.ts
deleted file mode 100644
index b4a32b67f2..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabTwoPageOne } from './tab-two-page-one';
-
-const routes: Routes = [
-  { path: '', component: TabTwoPageOne}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabTwoPageOneRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.module.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.module.ts
deleted file mode 100644
index 1f5310c258..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabTwoPageOne } from './tab-two-page-one';
-import { TabTwoPageOneRoutingModule } from './tab-two-page-one-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabTwoPageOneRoutingModule
-  ],
-  declarations: [TabTwoPageOne],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabTwoPageOneModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.ts
deleted file mode 100644
index 512e40d8dc..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-one/tab-two-page-one.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-two-page-one',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab Two Page One</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab Two Page One {{ts}}
-      <div>
-        <ion-button (click)="next()">Go to Page Two</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabTwoPageOne {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  next() {
-    this.navController.push('/nav-then-tabs/app/tabs/(tab-two:two)');
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three-routing.module.ts
deleted file mode 100644
index c2d868e2dc..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabTwoPageThree } from './tab-two-page-three';
-
-const routes: Routes = [
-  { path: '', component: TabTwoPageThree}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabTwoPageThreeRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.module.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.module.ts
deleted file mode 100644
index 7004e500fe..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabTwoPageThree } from './tab-two-page-three';
-import { TabTwoPageThreeRoutingModule } from './tab-two-page-three-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabTwoPageThreeRoutingModule
-  ],
-  declarations: [TabTwoPageThree],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabTwoPageThreeModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.ts
deleted file mode 100644
index 184d602474..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-three/tab-two-page-three.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-two-page-three',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab Two Page Three</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab Two Page Three {{ts}}
-      <div>
-        <ion-button (click)="back()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabTwoPageThree {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  back() {
-    this.navController.pop();
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two-routing.module.ts
deleted file mode 100644
index 4989518f14..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabTwoPageTwo } from './tab-two-page-two';
-
-const routes: Routes = [
-  { path: '', component: TabTwoPageTwo}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabTwoPageTwoRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.module.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.module.ts
deleted file mode 100644
index 10cbb71781..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { TabTwoPageTwo } from './tab-two-page-two';
-import { TabTwoPageTwoRoutingModule } from './tab-two-page-two-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabTwoPageTwoRoutingModule
-  ],
-  declarations: [TabTwoPageTwo],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabTwoPageTwoModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.ts b/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.ts
deleted file mode 100644
index ed58bee019..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tab-two-page-two/tab-two-page-two.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tab-two-page-two',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Tab Two Page Two</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Tab Two Page Two {{ts}}
-      <div>
-        <ion-button (click)="next()">Go to Page Three</ion-button>
-      </div>
-      <div>
-        <ion-button (click)="back()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class TabTwoPageTwo {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  next() {
-    this.navController.push('/nav-then-tabs/app/tabs/(tab-two:three)');
-  }
-
-  back() {
-    this.navController.pop();
-  }
-}
diff --git a/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page-routing.module.ts b/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page-routing.module.ts
deleted file mode 100644
index a5222372a5..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page-routing.module.ts
+++ /dev/null
@@ -1,76 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { TabsPage } from './tabs-page';
-
-import { TabOnePageOne } from '../tab-one-page-one/tab-one-page-one';
-import { TabOnePageTwo } from '../tab-one-page-two/tab-one-page-two';
-import { TabOnePageThree } from '../tab-one-page-three/tab-one-page-three';
-
-import { TabTwoPageOne } from '../tab-two-page-one/tab-two-page-one';
-import { TabTwoPageTwo } from '../tab-two-page-two/tab-two-page-two';
-import { TabTwoPageThree } from '../tab-two-page-three/tab-two-page-three';
-
-import { TabThreePageOne } from '../tab-three-page-one/tab-three-page-one';
-import { TabThreePageTwo } from '../tab-three-page-two/tab-three-page-two';
-import { TabThreePageThree } from '../tab-three-page-three/tab-three-page-three';
-
-const routes: Routes = [
-  {
-    path: 'tabs',
-    component: TabsPage,
-    children: [
-      {
-        path: 'one',
-        component: TabOnePageOne,
-        outlet: 'tab-one'
-      },
-      {
-        path: 'two',
-        component: TabOnePageTwo,
-        outlet: 'tab-one'
-      },
-      {
-        path: 'three',
-        component: TabOnePageThree,
-        outlet: 'tab-one'
-      },
-      {
-        path: 'one',
-        component: TabTwoPageOne,
-        outlet: 'tab-two'
-      },
-      {
-        path: 'two',
-        component: TabTwoPageTwo,
-        outlet: 'tab-two'
-      },
-      {
-        path: 'three',
-        component: TabTwoPageThree,
-        outlet: 'tab-two'
-      },
-      {
-        path: 'one',
-        component: TabThreePageOne,
-        outlet: 'tab-three'
-      },
-      {
-        path: 'two',
-        component: TabThreePageTwo,
-        outlet: 'tab-three'
-      },
-      {
-        path: 'three',
-        component: TabThreePageThree,
-        outlet: 'tab-three'
-      }
-    ]
-  }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class TabsPageRoutingModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.module.ts b/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.module.ts
deleted file mode 100644
index 0204104133..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.module.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import {
-  IonicAngularModule,
-  IonicRouterModule
-} from '@ionic/angular';
-
-import { TabsPage } from './tabs-page';
-
-import { TabsPageRoutingModule } from './tabs-page-routing.module';
-
-import { TabOnePageOneModule } from '../tab-one-page-one/tab-one-page-one.module';
-import { TabOnePageTwoModule } from '../tab-one-page-two/tab-one-page-two.module';
-import { TabOnePageThreeModule } from '../tab-one-page-three/tab-one-page-three.module';
-
-import { TabTwoPageOneModule } from '../tab-two-page-one/tab-two-page-one.module';
-import { TabTwoPageTwoModule } from '../tab-two-page-two/tab-two-page-two.module';
-import { TabTwoPageThreeModule } from '../tab-two-page-three/tab-two-page-three.module';
-
-import { TabThreePageOneModule } from '../tab-three-page-one/tab-three-page-one.module';
-import { TabThreePageTwoModule } from '../tab-three-page-two/tab-three-page-two.module';
-import { TabThreePageThreeModule } from '../tab-three-page-three/tab-three-page-three.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    TabsPageRoutingModule,
-    IonicAngularModule,
-    IonicRouterModule,
-    TabOnePageOneModule,
-    TabOnePageTwoModule,
-    TabOnePageThreeModule,
-
-
-    TabTwoPageOneModule,
-    TabTwoPageTwoModule,
-    TabTwoPageThreeModule,
-
-
-    TabThreePageOneModule,
-    TabThreePageTwoModule,
-    TabThreePageThreeModule
-  ],
-  declarations: [
-    TabsPage,
-  ],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class TabsPageModule { }
diff --git a/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.ts b/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.ts
deleted file mode 100644
index dfb26b10e0..0000000000
--- a/demos/angular/src/app/nav-then-tabs/tabs-page/tabs-page.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-import { Component, ElementRef, ViewChild, ViewEncapsulation } from '@angular/core';
-import { Location } from '@angular/common';
-import { Router } from '@angular/router';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'tabs-page',
-  template: `
-  <ion-tabs>
-    <ion-tab title="Tab One" icon="star" #tabOne>
-      <ion-nav [root]="tabOnePageOne" name="tab-one" lazy="true"></ion-nav>
-    </ion-tab>
-    <ion-tab title="Tab Two" icon="globe" #tabTwo>
-      <ion-nav [root]="tabTwoPageOne" name="tab-two" lazy="true"></ion-nav>
-    </ion-tab>
-    <ion-tab title="Tab Three" icon="logo-facebook" #tabThree>
-      <ion-nav [root]="tabThreePageOne" name="tab-three" lazy="true"></ion-nav>
-    </ion-tab>
-  </ion-tabs>
-  `
-})
-export class TabsPage {
-
-  tabOnePageOne = '/nav-then-tabs/app/tabs/(tab-one:one)';
-  tabTwoPageOne = '/nav-then-tabs/app/tabs/(tab-two:one)';
-  tabThreePageOne = '/nav-then-tabs/app/tabs/(tab-three:one)';
-
-  @ViewChild('tabOne') tabOne: ElementRef;
-  @ViewChild('tabTwo') tabTwo: ElementRef;
-  @ViewChild('tabThree') tabThree: ElementRef;
-
-  constructor(private router: Router, private location: Location) {
-  }
-
-  goBack() {
-    window.history.back();
-  }
-}
diff --git a/demos/angular/src/app/nested-nav/nested-nav-routing.module.ts b/demos/angular/src/app/nested-nav/nested-nav-routing.module.ts
deleted file mode 100644
index b89c01d642..0000000000
--- a/demos/angular/src/app/nested-nav/nested-nav-routing.module.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { NestedNavPageComponent } from './nested-nav.component';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: NestedNavPageComponent,
-    children: [
-      { path: 'nested-page-one', loadChildren: './nested-page-one/page-one.module#PageOneModule' },
-      { path: 'nested-page-two', loadChildren: './nested-page-two/page-two.module#PageTwoModule' },
-      { path: 'nested-page-three', loadChildren: './nested-page-three/page-three.module#PageThreeModule' }
-    ]
-  },
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class NestedNavRoutingModule { }
diff --git a/demos/angular/src/app/nested-nav/nested-nav.component.ts b/demos/angular/src/app/nested-nav/nested-nav.component.ts
deleted file mode 100644
index 4d227a465a..0000000000
--- a/demos/angular/src/app/nested-nav/nested-nav.component.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'app-nav-page',
-  template: `
-<ion-app>
-  <ion-nav></ion-nav>
-</ion-app>
-  `
-})
-export class NestedNavPageComponent {
-  constructor() {
-  }
-
-}
diff --git a/demos/angular/src/app/nested-nav/nested-nav.module.ts b/demos/angular/src/app/nested-nav/nested-nav.module.ts
deleted file mode 100644
index 0f49f67f8d..0000000000
--- a/demos/angular/src/app/nested-nav/nested-nav.module.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-
-import { NestedNavPageComponent } from './nested-nav.component';
-import { NestedNavRoutingModule } from './nested-nav-routing.module';
-
-import { IonicAngularModule, IonicRouterModule } from '@ionic/angular';
-
-@NgModule({
-  declarations: [
-    NestedNavPageComponent,
-  ],
-  imports: [
-    CommonModule,
-    IonicAngularModule,
-    IonicRouterModule,
-    NestedNavRoutingModule
-  ],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA]
-})
-export class NestedNavModule {}
diff --git a/demos/angular/src/app/nested-nav/nested-page-one/page-one-routing.module.ts b/demos/angular/src/app/nested-nav/nested-page-one/page-one-routing.module.ts
deleted file mode 100644
index 25ae75ef7d..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-one/page-one-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { PageOne } from './page-one';
-
-const routes: Routes = [
-  { path: '', component: PageOne}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class PageOneRoutingModule { }
diff --git a/demos/angular/src/app/nested-nav/nested-page-one/page-one.module.ts b/demos/angular/src/app/nested-nav/nested-page-one/page-one.module.ts
deleted file mode 100644
index 91b73d4c54..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-one/page-one.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { PageOne } from './page-one';
-import { PageOneRoutingModule } from './page-one-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    PageOneRoutingModule
-  ],
-  declarations: [PageOne],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class PageOneModule { }
diff --git a/demos/angular/src/app/nested-nav/nested-page-one/page-one.ts b/demos/angular/src/app/nested-nav/nested-page-one/page-one.ts
deleted file mode 100644
index 4848d1d4fd..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-one/page-one.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { Router } from '@angular/router';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'page-one',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Nested Page One</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Page One - {{ts}}
-      <div>
-        <ion-button (click)="pushPageTwoComponent()">Go to Page Two</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class PageOne {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-
-  pushPageTwoComponent() {
-    this.navController.push('/nested-nav/nested-page-two/section-one');
-  }
-}
diff --git a/demos/angular/src/app/nested-nav/nested-page-three/page-three-routing.module.ts b/demos/angular/src/app/nested-nav/nested-page-three/page-three-routing.module.ts
deleted file mode 100644
index d534208893..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-three/page-three-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { PageThree } from './page-three';
-
-const routes: Routes = [
-  { path: '', component: PageThree }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class PageThreeRoutingModule { }
diff --git a/demos/angular/src/app/nested-nav/nested-page-three/page-three.module.ts b/demos/angular/src/app/nested-nav/nested-page-three/page-three.module.ts
deleted file mode 100644
index 1f75e6350f..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-three/page-three.module.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { PageThree } from './page-three';
-import { PageThreeRoutingModule } from './page-three-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    PageThreeRoutingModule
-  ],
-  declarations: [
-    PageThree
-  ],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class PageThreeModule { }
diff --git a/demos/angular/src/app/nested-nav/nested-page-three/page-three.ts b/demos/angular/src/app/nested-nav/nested-page-three/page-three.ts
deleted file mode 100644
index 027af14e7a..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-three/page-three.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { Location } from '@angular/common';
-import { Router } from '@angular/router';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'page-three',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Page Three</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Page Three {{ts}}
-      <div>
-        <ion-button (click)="navPop()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class PageThree {
-
-  ts: number;
-  constructor(private router: Router, private location: Location) {
-
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-
-  navPop() {
-    window.history.back();
-  }
-
-}
diff --git a/demos/angular/src/app/nested-nav/nested-page-two/page-two-routing.module.ts b/demos/angular/src/app/nested-nav/nested-page-two/page-two-routing.module.ts
deleted file mode 100644
index c26197b19a..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-two/page-two-routing.module.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { PageTwo } from './page-two';
-import { PageTwoSectionOne } from './page-two-section-one';
-import { PageTwoSectionTwo } from './page-two-section-two';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: PageTwo,
-    children: [
-      {
-        path: 'section-one',
-        component: PageTwoSectionOne,
-      },
-      {
-        path: 'section-two',
-        component: PageTwoSectionTwo,
-      }
-    ]
-  }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class PageTwoRoutingModule { }
diff --git a/demos/angular/src/app/nested-nav/nested-page-two/page-two-section-one.ts b/demos/angular/src/app/nested-nav/nested-page-two/page-two-section-one.ts
deleted file mode 100644
index bccb52d18e..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-two/page-two-section-one.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { Router } from '@angular/router';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'page-two-section-one',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Page Two Section One</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Page Two Section One - TS {{ts}}
-      <div>
-        <ion-button (click)="pushPageTwoComponent()">Go to Section Two</ion-button>
-      </div>
-      <div>
-        <ion-button (click)="goBack()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class PageTwoSectionOne {
-
-  ts: number;
-
-  constructor(private router: Router) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  pushPageTwoComponent() {
-    this.router.navigateByUrl('/nested-nav/nested-page-two/section-two');
-  }
-
-  goBack() {
-    this.router.navigateByUrl('/nested-nav/nested-page-one');
-  }
-}
diff --git a/demos/angular/src/app/nested-nav/nested-page-two/page-two-section-two.ts b/demos/angular/src/app/nested-nav/nested-page-two/page-two-section-two.ts
deleted file mode 100644
index 2e3495e304..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-two/page-two-section-two.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { Router } from '@angular/router';
-import { NavController } from '@ionic/angular';
-
-@Component({
-  selector: 'page-two-section-two',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Page Two Section Two</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Page Two Section Two {{ts}}
-      <div>
-        <ion-button (click)="pushPageTwoComponent()">Go to Page Three</ion-button>
-      </div>
-      <div>
-        <ion-button (click)="goBack()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class PageTwoSectionTwo {
-
-  ts: number;
-  constructor(private router: Router) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-  pushPageTwoComponent() {
-    this.router.navigateByUrl('/nested-nav/nested-page-three');
-  }
-
-  goBack() {
-    this.router.navigateByUrl('/nested-nav/nested-page-two/section-one');
-  }
-}
diff --git a/demos/angular/src/app/nested-nav/nested-page-two/page-two.module.ts b/demos/angular/src/app/nested-nav/nested-page-two/page-two.module.ts
deleted file mode 100644
index 7b4f10879a..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-two/page-two.module.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import {
-  IonicAngularModule,
-  IonicRouterModule
-} from '@ionic/angular';
-
-import { PageTwo } from './page-two';
-import { PageTwoSectionOne } from './page-two-section-one';
-import { PageTwoSectionTwo } from './page-two-section-two';
-
-import { PageTwoRoutingModule } from './page-two-routing.module';
-
-
-@NgModule({
-  imports: [
-    CommonModule,
-    PageTwoRoutingModule,
-    IonicAngularModule,
-    IonicRouterModule
-  ],
-  declarations: [
-    PageTwo,
-    PageTwoSectionOne,
-    PageTwoSectionTwo
-  ],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class PageTwoModule { }
diff --git a/demos/angular/src/app/nested-nav/nested-page-two/page-two.ts b/demos/angular/src/app/nested-nav/nested-page-two/page-two.ts
deleted file mode 100644
index 4186feca6c..0000000000
--- a/demos/angular/src/app/nested-nav/nested-page-two/page-two.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-
-@Component({
-  selector: 'page-two',
-  template: `
-  <ion-nav></ion-nav>
-  <!-- <router-outlet></router-outlet> -->
-  `
-})
-export class PageTwo {
-
-  constructor(private navController: NavController) {
-  }
-
-  pushPageThree() {
-    this.navController.push('/nested-nav/nested-page-three');
-  }
-
-  goBack() {
-    window.history.back();
-  }
-}
diff --git a/demos/angular/src/app/no-routing-nav/no-routing-nav-routing.module.ts b/demos/angular/src/app/no-routing-nav/no-routing-nav-routing.module.ts
deleted file mode 100644
index b3f29924c2..0000000000
--- a/demos/angular/src/app/no-routing-nav/no-routing-nav-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { NoRoutingNavPageComponent } from './no-routing-nav.component';
-
-const routes: Routes = [
-  { path: '', component: NoRoutingNavPageComponent }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class NoRoutingNavRoutingModule { }
diff --git a/demos/angular/src/app/no-routing-nav/no-routing-nav.component.ts b/demos/angular/src/app/no-routing-nav/no-routing-nav.component.ts
deleted file mode 100644
index 044c2b56ad..0000000000
--- a/demos/angular/src/app/no-routing-nav/no-routing-nav.component.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Component } from '@angular/core';
-
-import { PageOne } from './pages/page-one';
-
-@Component({
-  selector: 'app-nav-page',
-  template: `
-<ion-app>
-  <ion-nav [root]="pageOne"></ion-nav>
-</ion-app>
-  `
-})
-export class NoRoutingNavPageComponent {
-
-  pageOne: any = PageOne;
-  constructor() {
-
-  }
-
-}
diff --git a/demos/angular/src/app/no-routing-nav/no-routing-nav.module.ts b/demos/angular/src/app/no-routing-nav/no-routing-nav.module.ts
deleted file mode 100644
index 0bf7233673..0000000000
--- a/demos/angular/src/app/no-routing-nav/no-routing-nav.module.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { NoRoutingNavPageComponent } from './no-routing-nav.component';
-import { NoRoutingNavRoutingModule } from './no-routing-nav-routing.module';
-import { IonicAngularModule } from '@ionic/angular';
-
-import { PageOne } from './pages/page-one';
-import { PageTwo } from './pages/page-two';
-import { PageThree } from './pages/page-three';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    NoRoutingNavRoutingModule,
-    IonicAngularModule,
-  ],
-  declarations: [
-    NoRoutingNavPageComponent,
-    PageOne,
-    PageTwo,
-    PageThree
-  ],
-  entryComponents: [
-    PageOne,
-    PageTwo,
-    PageThree
-  ],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA]
-})
-export class NoRoutingNavModule { }
diff --git a/demos/angular/src/app/no-routing-nav/pages/page-one.ts b/demos/angular/src/app/no-routing-nav/pages/page-one.ts
deleted file mode 100644
index c68e800048..0000000000
--- a/demos/angular/src/app/no-routing-nav/pages/page-one.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import { Component } from '@angular/core';
-
-import { PageTwo } from './page-two';
-
-@Component({
-  selector: 'page-one',
-  template: `
-<ion-page>
-  <ion-header>
-    <ion-toolbar>
-      <ion-title>Page One</ion-title>
-    </ion-toolbar>
-  </ion-header>
-  <ion-content>
-    Page One
-    <div>
-      <ion-button (click)="goToPageTwo()">Go to Page Two</ion-button>
-    </div>
-    <ul>
-      <li>ngOnInit - {{ngOnInitDetection}}</li>
-      <li>ionViewWillEnter - {{ionViewWillEnterDetection}}</li>
-      <li>ionViewDidEnter - {{ionViewDidEnterDetection}}</li>
-    </ul>
-  </ion-content>
-</ion-page>
-  `
-})
-export class PageOne {
-
-  ngOnInitDetection = 'initial';
-  ionViewWillEnterDetection = 'initial';
-  ionViewDidEnterDetection = 'initial';
-
-  constructor() {
-
-  }
-
-
-  ngOnInit() {
-    console.log('page one ngOnInit');
-    setInterval(() => {
-      this.ngOnInitDetection = '' + Date.now();
-    }, 500);
-  }
-
-  ionViewWillEnter() {
-    console.log('page one ionViewWillEnter');
-    setInterval(() => {
-      this.ionViewWillEnterDetection = '' + Date.now();
-    }, 500);
-  }
-
-  ionViewDidEnter() {
-    console.log('page one ionViewDidEnter');
-    setInterval(() => {
-      this.ionViewDidEnterDetection = '' + Date.now();
-    }, 500);
-  }
-
-  goToPageTwo() {
-    const nav = document.querySelector('ion-nav') as any;
-    nav.push(PageTwo).then(() => console.log('push complete'));
-  }
-}
diff --git a/demos/angular/src/app/no-routing-nav/pages/page-three.ts b/demos/angular/src/app/no-routing-nav/pages/page-three.ts
deleted file mode 100644
index 984d6c185e..0000000000
--- a/demos/angular/src/app/no-routing-nav/pages/page-three.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'page-three',
-  template: `
-<ion-page>
-  <ion-header>
-    <ion-toolbar>
-      <ion-buttons slot="start">
-        <ion-back-button></ion-back-button>
-      </ion-buttons>
-      <ion-title>Page Three</ion-title>
-    </ion-toolbar>
-  </ion-header>
-  <ion-content>
-    Page Three
-    <div>
-    <ion-button (click)="goBack()">Go Back</ion-button>
-  </div>
-    <ul>
-      <li>ngOnInit - {{ngOnInitDetection}}</li>
-      <li>ionViewWillEnter - {{ionViewWillEnterDetection}}</li>
-      <li>ionViewDidEnter - {{ionViewDidEnterDetection}}</li>
-    </ul>
-  </ion-content>
-</ion-page>
-  `
-})
-export class PageThree {
-
-  ngOnInitDetection = 'initial';
-  ionViewWillEnterDetection = 'initial';
-  ionViewDidEnterDetection = 'initial';
-
-  constructor() {
-
-  }
-
-
-  ngOnInit() {
-    console.log('page two ngOnInit');
-    setInterval(() => {
-      this.ngOnInitDetection = '' + Date.now();
-    }, 500);
-  }
-
-  ionViewWillEnter() {
-    console.log('page two ionViewWillEnter');
-    setInterval(() => {
-      this.ionViewWillEnterDetection = '' + Date.now();
-    }, 500);
-  }
-
-  ionViewDidEnter() {
-    console.log('page two ionViewDidEnter');
-    setInterval(() => {
-      this.ionViewDidEnterDetection = '' + Date.now();
-    }, 500);
-  }
-
-  goBack() {
-    const nav = document.querySelector('ion-nav') as any;
-    nav.pop().then(() => console.log('pop complete'));
-  }
-}
diff --git a/demos/angular/src/app/no-routing-nav/pages/page-two.ts b/demos/angular/src/app/no-routing-nav/pages/page-two.ts
deleted file mode 100644
index 87b85e07ae..0000000000
--- a/demos/angular/src/app/no-routing-nav/pages/page-two.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-import { Component } from '@angular/core';
-
-import { PageThree } from './page-three';
-
-@Component({
-  selector: 'page-two',
-  template: `
-<ion-page>
-  <ion-header>
-    <ion-toolbar>
-      <ion-buttons slot="start">
-        <ion-back-button></ion-back-button>
-      </ion-buttons>
-      <ion-title>Page Two</ion-title>
-    </ion-toolbar>
-  </ion-header>
-  <ion-content>
-    Page Two
-    <div>
-      <ion-button (click)="goNext()">Go to Page Three</ion-button>
-    </div>
-    <div>
-    <ion-button (click)="goBack()">Go Back</ion-button>
-  </div>
-    <ul>
-      <li>ngOnInit - {{ngOnInitDetection}}</li>
-      <li>ionViewWillEnter - {{ionViewWillEnterDetection}}</li>
-      <li>ionViewDidEnter - {{ionViewDidEnterDetection}}</li>
-    </ul>
-  </ion-content>
-</ion-page>
-  `
-})
-export class PageTwo {
-
-  ngOnInitDetection = 'initial';
-  ionViewWillEnterDetection = 'initial';
-  ionViewDidEnterDetection = 'initial';
-
-  constructor() {
-
-  }
-
-
-  ngOnInit() {
-    console.log('page two ngOnInit');
-    setInterval(() => {
-      this.ngOnInitDetection = '' + Date.now();
-    }, 500);
-  }
-
-  ionViewWillEnter() {
-    console.log('page two ionViewWillEnter');
-    setInterval(() => {
-      this.ionViewWillEnterDetection = '' + Date.now();
-    }, 500);
-  }
-
-  ionViewDidEnter() {
-    console.log('page two ionViewDidEnter');
-    setInterval(() => {
-      this.ionViewDidEnterDetection = '' + Date.now();
-    }, 500);
-  }
-
-  goNext() {
-    const nav = document.querySelector('ion-nav') as any;
-    nav.push(PageThree).then(() => console.log('push complete'));
-  }
-
-  goBack() {
-    const nav = document.querySelector('ion-nav') as any;
-    nav.pop().then(() => console.log('pop complete'));
-  }
-}
diff --git a/demos/angular/src/app/popover/popover-page.component.ts b/demos/angular/src/app/popover/popover-page.component.ts
index f5840422e1..63fdf95624 100644
--- a/demos/angular/src/app/popover/popover-page.component.ts
+++ b/demos/angular/src/app/popover/popover-page.component.ts
@@ -7,7 +7,6 @@ import { PopoverPageToPresent } from './popover-page-to-present';
   selector: 'app-popover-page',
   template: `
   <ion-app>
-    <ion-page class="show-page">
       <ion-header>
         <ion-toolbar>
           <ion-title>Test</ion-title>
@@ -21,7 +20,6 @@ import { PopoverPageToPresent } from './popover-page-to-present';
       <ion-content padding>
         <ion-button (click)="clickMe($event)">Open Basic Popover</ion-button>
       </ion-content>
-    </ion-page>
 </ion-app>
   `
 })
@@ -30,8 +28,8 @@ export class PopoverPageComponent {
   constructor(private popoverController: PopoverController) {
   }
 
-  clickMe(event: Event) {
-    const popover = this.popoverController.create({
+  async clickMe(event: Event) {
+    const popover = await this.popoverController.create({
       component: PopoverPageToPresent,
       ev: event
     });
diff --git a/demos/angular/src/app/segment/segment-page.component.ts b/demos/angular/src/app/segment/segment-page.component.ts
index 8c3328c363..9b3433829b 100644
--- a/demos/angular/src/app/segment/segment-page.component.ts
+++ b/demos/angular/src/app/segment/segment-page.component.ts
@@ -4,7 +4,6 @@ import { Component } from '@angular/core';
   selector: 'app-segment-page',
   template: `
   <ion-app>
-    <ion-page class="show-page">
       <ion-header>
         <ion-toolbar>
           <ion-segment id="segment" [(ngModel)]="relationship" (ionChange)="onSegmentChanged($event)">
@@ -118,7 +117,6 @@ import { Component } from '@angular/core';
           </ion-segment>
         </ion-toolbar>
       </ion-footer>
-  </ion-page>
 </ion-app>
   `
 })
diff --git a/demos/angular/src/app/show-hide-when/show-hide-when.html b/demos/angular/src/app/show-hide-when/show-hide-when.html
index b664295869..eca1918cf5 100644
--- a/demos/angular/src/app/show-hide-when/show-hide-when.html
+++ b/demos/angular/src/app/show-hide-when/show-hide-when.html
@@ -1,5 +1,4 @@
 <ion-app>
-  <ion-page class="show-page">
     <ion-header>
       <ion-toolbar>
         <ion-title>Test</ion-title>
@@ -160,5 +159,4 @@
       </div>
 
     </ion-content>
-  </ion-page>
 </ion-app>
diff --git a/demos/angular/src/app/simple-nav/page-one/page-one-routing.module.ts b/demos/angular/src/app/simple-nav/page-one/page-one-routing.module.ts
deleted file mode 100644
index 25ae75ef7d..0000000000
--- a/demos/angular/src/app/simple-nav/page-one/page-one-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { PageOne } from './page-one';
-
-const routes: Routes = [
-  { path: '', component: PageOne}
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class PageOneRoutingModule { }
diff --git a/demos/angular/src/app/simple-nav/page-one/page-one.module.ts b/demos/angular/src/app/simple-nav/page-one/page-one.module.ts
deleted file mode 100644
index 91b73d4c54..0000000000
--- a/demos/angular/src/app/simple-nav/page-one/page-one.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { PageOne } from './page-one';
-import { PageOneRoutingModule } from './page-one-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    PageOneRoutingModule
-  ],
-  declarations: [PageOne],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class PageOneModule { }
diff --git a/demos/angular/src/app/simple-nav/page-one/page-one.ts b/demos/angular/src/app/simple-nav/page-one/page-one.ts
deleted file mode 100644
index 684b7cff63..0000000000
--- a/demos/angular/src/app/simple-nav/page-one/page-one.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController } from '@ionic/angular';
-
-import { PageTwo } from '../page-two/page-two';
-
-@Component({
-  selector: 'page-one',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Simple Page One</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Page One - {{ts}}
-      <div>
-        <ion-button (click)="pushPageTwoComponent()">Go to Page Two</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class PageOne {
-
-  ts: number;
-  constructor(private navController: NavController) {
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-
-  pushPageTwoComponent() {
-    this.navController.push('/simple-nav/page-two');
-  }
-
-
-
-}
diff --git a/demos/angular/src/app/simple-nav/page-three/page-three-routing.module.ts b/demos/angular/src/app/simple-nav/page-three/page-three-routing.module.ts
deleted file mode 100644
index d534208893..0000000000
--- a/demos/angular/src/app/simple-nav/page-three/page-three-routing.module.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { PageThree } from './page-three';
-
-const routes: Routes = [
-  { path: '', component: PageThree }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class PageThreeRoutingModule { }
diff --git a/demos/angular/src/app/simple-nav/page-three/page-three.module.ts b/demos/angular/src/app/simple-nav/page-three/page-three.module.ts
deleted file mode 100644
index 1f75e6350f..0000000000
--- a/demos/angular/src/app/simple-nav/page-three/page-three.module.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { PageThree } from './page-three';
-import { PageThreeRoutingModule } from './page-three-routing.module';
-
-@NgModule({
-  imports: [
-    CommonModule,
-    PageThreeRoutingModule
-  ],
-  declarations: [
-    PageThree
-  ],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class PageThreeModule { }
diff --git a/demos/angular/src/app/simple-nav/page-three/page-three.ts b/demos/angular/src/app/simple-nav/page-three/page-three.ts
deleted file mode 100644
index 828d0e0419..0000000000
--- a/demos/angular/src/app/simple-nav/page-three/page-three.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { NavController, NavParams } from '@ionic/angular';
-
-@Component({
-  selector: 'page-three',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Page Three</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Page Three {{ts}}
-      <div>isProd: {{isProd}}</div>
-      <div>paramOne: {{paramOne}}</div>
-      <div>paramTwo: {{paramTwo}}</div>
-      <div>
-        <ion-button (click)="navPop()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class PageThree {
-
-  ts: number;
-  isProd = false;
-  paramOne: any = null;
-  paramTwo: any = null;
-  constructor(private navController: NavController, private navParams: NavParams) {
-
-    this.isProd = navParams.get('isProd');
-    this.paramOne = navParams.get('paramOne');
-    this.paramTwo = navParams.get('paramTwo');
-
-    setInterval(() => {
-      this.ts = Date.now();
-    }, 500);
-  }
-
-
-  navPop() {
-    this.navController.pop();
-  }
-
-}
diff --git a/demos/angular/src/app/simple-nav/page-two/page-two-routing.module.ts b/demos/angular/src/app/simple-nav/page-two/page-two-routing.module.ts
deleted file mode 100644
index 4700b6c8b5..0000000000
--- a/demos/angular/src/app/simple-nav/page-two/page-two-routing.module.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { PageTwo } from './page-two';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: PageTwo,
-  }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class PageTwoRoutingModule { }
diff --git a/demos/angular/src/app/simple-nav/page-two/page-two.module.ts b/demos/angular/src/app/simple-nav/page-two/page-two.module.ts
deleted file mode 100644
index 726d67cfd1..0000000000
--- a/demos/angular/src/app/simple-nav/page-two/page-two.module.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import {
-  IonicAngularModule,
-  IonicRouterModule
-} from '@ionic/angular';
-
-import { PageTwo } from './page-two';
-import { PageTwoRoutingModule } from './page-two-routing.module';
-
-
-@NgModule({
-  imports: [
-    CommonModule,
-    PageTwoRoutingModule,
-    IonicAngularModule,
-    IonicRouterModule
-  ],
-  declarations: [
-    PageTwo,
-  ],
-  schemas: [
-    CUSTOM_ELEMENTS_SCHEMA
-  ]
-})
-export class PageTwoModule { }
diff --git a/demos/angular/src/app/simple-nav/page-two/page-two.ts b/demos/angular/src/app/simple-nav/page-two/page-two.ts
deleted file mode 100644
index 266d9786ed..0000000000
--- a/demos/angular/src/app/simple-nav/page-two/page-two.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-import { Component, ViewEncapsulation } from '@angular/core';
-import { Location } from '@angular/common';
-import { NavController } from '@ionic/angular';
-
-
-@Component({
-  selector: 'page-two',
-  template: `
-  <ion-page>
-    <ion-header>
-      <ion-toolbar>
-        <ion-title>Page Two</ion-title>
-      </ion-toolbar>
-    </ion-header>
-    <ion-content padding>
-      Page Two - {{ts}}
-      <div>
-        <ion-button (click)="pushPageThreeComponent()">Go to Page Three</ion-button>
-      </div>
-      <div>
-        <ion-button (click)="goBack()">Go Back</ion-button>
-      </div>
-    </ion-content>
-  </ion-page>
-  `
-})
-export class PageTwo {
-
-  constructor(private navController: NavController) {
-  }
-
-  pushPageThreeComponent() {
-    this.navController.push('/simple-nav/page-three/jim/halpert');
-  }
-
-  goBack() {
-    this.navController.pop();
-  }
-}
diff --git a/demos/angular/src/app/simple-nav/simple-nav-routing.module.ts b/demos/angular/src/app/simple-nav/simple-nav-routing.module.ts
deleted file mode 100644
index 5a4ad2c1b3..0000000000
--- a/demos/angular/src/app/simple-nav/simple-nav-routing.module.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-import { SimpleNavPageComponent } from './simple-nav.component';
-
-const routes: Routes = [
-  {
-    path: '',
-    component: SimpleNavPageComponent,
-    children: [
-      { path: 'page-one', loadChildren: './page-one/page-one.module#PageOneModule' },
-      { path: 'page-two', loadChildren: './page-two/page-two.module#PageTwoModule' },
-      { path: 'page-three/:paramOne/:paramTwo', loadChildren: './page-three/page-three.module#PageThreeModule', data: { isProd: true} }
-    ]
-  },
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class SimpleNavRoutingModule { }
diff --git a/demos/angular/src/app/simple-nav/simple-nav.component.ts b/demos/angular/src/app/simple-nav/simple-nav.component.ts
deleted file mode 100644
index 205c2b9cd2..0000000000
--- a/demos/angular/src/app/simple-nav/simple-nav.component.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'app-nav-page',
-  template: `
-<ion-app>
-  <ion-nav></ion-nav>
-</ion-app>
-  `
-})
-export class SimpleNavPageComponent {
-  constructor() {
-  }
-
-}
diff --git a/demos/angular/src/app/simple-nav/simple-nav.module.ts b/demos/angular/src/app/simple-nav/simple-nav.module.ts
deleted file mode 100644
index 89299b0dd7..0000000000
--- a/demos/angular/src/app/simple-nav/simple-nav.module.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-
-import { SimpleNavPageComponent } from './simple-nav.component';
-import { SimpleNavRoutingModule } from './simple-nav-routing.module';
-
-import { IonicAngularModule, IonicRouterModule } from '@ionic/angular';
-
-@NgModule({
-  declarations: [
-    SimpleNavPageComponent,
-  ],
-  imports: [
-    CommonModule,
-    IonicAngularModule,
-    IonicRouterModule,
-    SimpleNavRoutingModule
-  ],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA]
-})
-export class SimpleNavModule {}
diff --git a/demos/angular/src/app/toast/toast-page.component.ts b/demos/angular/src/app/toast/toast-page.component.ts
index ddaa7b7650..4d30ef393c 100644
--- a/demos/angular/src/app/toast/toast-page.component.ts
+++ b/demos/angular/src/app/toast/toast-page.component.ts
@@ -6,7 +6,6 @@ import { ToastController } from '@ionic/angular';
   selector: 'app-toast-page',
   template: `
   <ion-app>
-  <ion-page class="show-page">
     <ion-header>
       <ion-toolbar>
         <ion-title>Test</ion-title>
@@ -15,7 +14,6 @@ import { ToastController } from '@ionic/angular';
     <ion-content padding>
       <ion-button (click)="clickMe()">Open Basic Toast</ion-button>
     </ion-content>
-  </ion-page>
 </ion-app>
   `
 })
@@ -25,8 +23,8 @@ export class ToastPageComponent {
 
   }
 
-  clickMe() {
-    const toast = this.toastController.create({
+  async clickMe() {
+    const toast = await this.toastController.create({
       closeButtonText: 'close dat toast',
       duration: 1000,
       message: 'Howdy ho toasty neighbor',
diff --git a/demos/angular/src/app/virtual-scroll/virtual-scroll-page.component.ts b/demos/angular/src/app/virtual-scroll/virtual-scroll-page.component.ts
index 652b145186..b13a5d4c38 100644
--- a/demos/angular/src/app/virtual-scroll/virtual-scroll-page.component.ts
+++ b/demos/angular/src/app/virtual-scroll/virtual-scroll-page.component.ts
@@ -6,7 +6,6 @@ import { ToastController } from '@ionic/angular';
   selector: 'app-virtual-scroll-page',
   template: `
   <ion-app>
-    <ion-page>
       <ion-header>
         <ion-toolbar>
           <ion-title>Test</ion-title>
@@ -33,8 +32,6 @@ import { ToastController } from '@ionic/angular';
   </ion-virtual-scroll>
 
     </ion-content>
-    </ion-page>
-
   </ion-app>`
 })
 export class VirtualScrollPageComponent {