diff --git a/demos/toast/index.ts b/demos/toast/index.ts
new file mode 100644
index 0000000000..20ce887657
--- /dev/null
+++ b/demos/toast/index.ts
@@ -0,0 +1,59 @@
+import {App, Page, Toast, NavController} from 'ionic-angular';
+
+@Page({
+ templateUrl: 'main.html'
+})
+class ApiPage {
+ constructor(private nav: NavController) { }
+
+ showToast() {
+ const toast = Toast.create({
+ message: 'User was created successfully',
+ });
+
+ toast.onDismiss(this.dismissHandler);
+ this.nav.present(toast);
+ }
+
+ showLongToast() {
+ const toast = Toast.create({
+ message: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea voluptatibus quibusdam eum nihil optio, ullam accusamus magni, nobis suscipit reprehenderit, sequi quam amet impedit. Accusamus dolorem voluptates laborum dolor obcaecati.',
+ });
+
+ toast.onDismiss(this.dismissHandler);
+ this.nav.present(toast);
+ }
+
+ showDismissDurationToast() {
+ const toast = Toast.create({
+ message: 'I am dismissed after 1.5 seconds',
+ duration: 1500
+ });
+ toast.onDismiss(this.dismissHandler);
+ this.nav.present(toast);
+ }
+
+ showToastWithCloseButton() {
+ const toast = Toast.create({
+ message: 'Your internet connection appears to be offline. Data integrity is not gauranteed.',
+ showCloseButton: true,
+ closeButtonText: 'Ok'
+ });
+ toast.onDismiss(this.dismissHandler);
+ this.nav.present(toast);
+ }
+
+ private dismissHandler(toast: Toast) {
+ console.info('Toast onDismiss()');
+ }
+
+}
+
+
+@App({
+ template: ''
+})
+class ApiDemoApp {
+ root = ApiPage;
+ constructor() { }
+}
diff --git a/demos/toast/main.html b/demos/toast/main.html
new file mode 100644
index 0000000000..42341c5178
--- /dev/null
+++ b/demos/toast/main.html
@@ -0,0 +1,11 @@
+
+ Toast
+
+
+
+
+
+
+
+
+