diff --git a/packages/demos/angular/package-lock.json b/packages/demos/angular/package-lock.json
index f0e95be2f8..0e55edadd7 100644
--- a/packages/demos/angular/package-lock.json
+++ b/packages/demos/angular/package-lock.json
@@ -60,7 +60,7 @@
         "autoprefixer": "6.7.7",
         "chalk": "2.2.2",
         "circular-dependency-plugin": "3.0.0",
-        "common-tags": "1.6.0",
+        "common-tags": "1.7.0",
         "copy-webpack-plugin": "4.3.1",
         "core-object": "3.1.5",
         "css-loader": "0.28.8",
@@ -255,9 +255,9 @@
       }
     },
     "@ionic/angular": {
-      "version": "0.0.2-16",
-      "resolved": "https://registry.npmjs.org/@ionic/angular/-/angular-0.0.2-16.tgz",
-      "integrity": "sha512-9ZS3GgO8X9G/df/2Pi9vZPgNyDYvsn2ees10Mt2u84SJC5Gf1OhbkLGiPbwVsOAxQV1qOgGCl50TXaXErNZj+A==",
+      "version": "0.0.2-17",
+      "resolved": "https://registry.npmjs.org/@ionic/angular/-/angular-0.0.2-17.tgz",
+      "integrity": "sha512-o2w2l7Mc7CAsSdC/d268ODDqD0HQ+gxP9V0RTpcS+E0jBEXybOW5dG/a75fT7uccdxeiscTv3XkzsyQBCIJwYA==",
       "requires": {
         "@stencil/core": "0.1.1-0"
       },
@@ -281,9 +281,9 @@
       }
     },
     "@ionic/core": {
-      "version": "0.0.2-38",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-0.0.2-38.tgz",
-      "integrity": "sha512-tOP7WZ9V1WXYfYy96LJgUyutVtOerbnJDJccMv1wpAckVWPzsCxyM1jvdehRcsOdXjhq2+HeByIZS3f8B4okqQ=="
+      "version": "0.0.2-41",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-0.0.2-41.tgz",
+      "integrity": "sha512-7mBe4RbrvD+LDL5HaEsWe5p2WDM4xf4vE+cMHNzPmqFN6lx60c3XkA1twVXZBjfcarYTCqne3SvbbHGfOrkS9w=="
     },
     "@ngtools/json-schema": {
       "version": "1.1.0",
@@ -1466,9 +1466,9 @@
       "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
     },
     "common-tags": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.6.0.tgz",
-      "integrity": "sha512-sgmgEodNLbxnSSoR5a2xH23CoDJ9J5MKsJS/tqplfmJLpikG0oWMpAb+tM8ERQCMpp9I+ERf6SYl158G6GwX0w==",
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.7.0.tgz",
+      "integrity": "sha512-A63PFbYd8ccyVZbqZkWjQ9+BqSaROt/BCNesdhZZNjvUXx1U59fA+XDeaIJWqrgPsoIdmYds1qofDNDvrffw9Q==",
       "dev": true,
       "requires": {
         "babel-runtime": "6.26.0"
diff --git a/packages/demos/angular/src/app/modal/modal-page-to-present.ts b/packages/demos/angular/src/app/modal/modal-page-to-present.ts
index ec2fd8d998..3cd851dfeb 100644
--- a/packages/demos/angular/src/app/modal/modal-page-to-present.ts
+++ b/packages/demos/angular/src/app/modal/modal-page-to-present.ts
@@ -1,26 +1,30 @@
 import { Component } from '@angular/core';
+import { ModalController } from '@ionic/angular';
 
 @Component({
   selector: 'page-one',
   template: `
-<ion-header>
-  <ion-toolbar>
-    <ion-title>Page One</ion-title>
-  </ion-toolbar>
-</ion-header>
-<ion-content>
-  Page One
-  <ul>
-    <li>ngOnInit - {{ngOnInitDetection}}</li>
-  </ul>
-</ion-content>
+<ion-page>
+  <ion-header>
+    <ion-toolbar>
+      <ion-title>Page One</ion-title>
+    </ion-toolbar>
+  </ion-header>
+  <ion-content>
+    Page One
+    <ul>
+      <li>ngOnInit - {{ngOnInitDetection}}</li>
+    </ul>
+    <ion-button (click)="dismiss()">Close Modal</ion-button>
+  </ion-content>
+</ion-page>
   `
 })
 export class ModalPageToPresent {
 
   ngOnInitDetection = 'initial';
 
-  constructor() {
+  constructor(private modalController: ModalController) {
 
   }
 
@@ -32,4 +36,7 @@ export class ModalPageToPresent {
     }, 500);
   }
 
+  dismiss() {
+    this.modalController.dismiss();
+  }
 }
diff --git a/packages/demos/angular/src/app/nav/pages/page-one.ts b/packages/demos/angular/src/app/nav/pages/page-one.ts
index f1d26e9059..c68e800048 100644
--- a/packages/demos/angular/src/app/nav/pages/page-one.ts
+++ b/packages/demos/angular/src/app/nav/pages/page-one.ts
@@ -5,22 +5,24 @@ import { PageTwo } from './page-two';
 @Component({
   selector: 'page-one',
   template: `
-<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>
+  <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 {
diff --git a/packages/demos/angular/src/app/nav/pages/page-three.ts b/packages/demos/angular/src/app/nav/pages/page-three.ts
index c36e8cba5b..ffca811b68 100644
--- a/packages/demos/angular/src/app/nav/pages/page-three.ts
+++ b/packages/demos/angular/src/app/nav/pages/page-three.ts
@@ -3,22 +3,24 @@ import { Component } from '@angular/core';
 @Component({
   selector: 'page-three',
   template: `
-<ion-header>
-  <ion-toolbar>
-    <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>
+  <ion-header>
+    <ion-toolbar>
+      <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 {
diff --git a/packages/demos/angular/src/app/nav/pages/page-two.ts b/packages/demos/angular/src/app/nav/pages/page-two.ts
index 24ed2e6ed7..8ccdb35c0f 100644
--- a/packages/demos/angular/src/app/nav/pages/page-two.ts
+++ b/packages/demos/angular/src/app/nav/pages/page-two.ts
@@ -5,25 +5,27 @@ import { PageThree } from './page-three';
 @Component({
   selector: 'page-two',
   template: `
-<ion-header>
-  <ion-toolbar>
-    <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>
+<ion-page>
+  <ion-header>
+    <ion-toolbar>
+      <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>
-  <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>
+    <ul>
+      <li>ngOnInit - {{ngOnInitDetection}}</li>
+      <li>ionViewWillEnter - {{ionViewWillEnterDetection}}</li>
+      <li>ionViewDidEnter - {{ionViewDidEnterDetection}}</li>
+    </ul>
+  </ion-content>
+</ion-page>
   `
 })
 export class PageTwo {