diff --git a/demos/component-docs/helpers.ts b/demos/component-docs/helpers.ts
index 481af01336..ef53b5e8fb 100644
--- a/demos/component-docs/helpers.ts
+++ b/demos/component-docs/helpers.ts
@@ -97,6 +97,7 @@ export function getPageFor(hash) {
         'segment': inputs.SegmentPage,
         'select': inputs.SelectPage,
         'switch': inputs.SwitchPage,
+        'search': inputs.SearchPage,
 
         'inputs': labels.BasicPage,
         'fixed-inline-labels': labels.FixedInlinePage,
diff --git a/demos/component-docs/inputs/inputs.ts b/demos/component-docs/inputs/inputs.ts
index ee270aa390..e8c13a52a9 100644
--- a/demos/component-docs/inputs/inputs.ts
+++ b/demos/component-docs/inputs/inputs.ts
@@ -1,6 +1,7 @@
 export * from './checkbox/pages';
 export * from './radio/pages';
 export * from './range/pages';
+export * from './search/pages';
 export * from './segment/pages';
 export * from './select/pages';
 export * from './switch/pages';
diff --git a/demos/component-docs/inputs/search/pages.ts b/demos/component-docs/inputs/search/pages.ts
new file mode 100644
index 0000000000..bb654cdcce
--- /dev/null
+++ b/demos/component-docs/inputs/search/pages.ts
@@ -0,0 +1,69 @@
+import {Page} from 'ionic/ionic';
+import {forwardRef} from 'angular2/angular2';
+import {AndroidAttribute} from '../../helpers';
+
+@Page({
+  templateUrl: 'inputs/search/template.html',
+  directives: [forwardRef(() => AndroidAttribute)]
+})
+export class SearchPage{
+  constructor() {
+    this.searchQuery = '';
+    this.items = [
+      'Amsterdam',
+      'Bogota',
+      'Buenos Aires',
+      'Cairo',
+      'Dhaka',
+      'Edinburgh',
+      'Geneva',
+      'Genoa',
+      'Glasglow',
+      'Hanoi',
+      'Hong Kong',
+      'Islamabad',
+      'Istanbul',
+      'Jakarta',
+      'Kiel',
+      'Kyoto',
+      'Le Havre',
+      'Lebanon',
+      'Lhasa',
+      'Lima',
+      'London',
+      'Los Angeles',
+      'Madrid',
+      'Manila',
+      'New York',
+      'Olympia',
+      'Oslo',
+      'Panama City',
+      'Peking',
+      'Philadelphia',
+      'San Francisco',
+      'Seoul',
+      'Taipeh',
+      'Tel Aviv',
+      'Tokio',
+      'Uelzen',
+      'Washington'
+    ];
+  }
+
+  getItems() {
+    var q = this.searchQuery;
+    if(q.trim() == '') {
+      return this.items;
+    }
+    return this.items.filter((v) => {
+      if(v.toLowerCase().indexOf(q.toLowerCase()) >= 0) {
+        return true;
+      }
+      return false;
+    })
+  }
+
+
+  
+
+}
diff --git a/demos/component-docs/inputs/search/template.html b/demos/component-docs/inputs/search/template.html
new file mode 100644
index 0000000000..bfb6aebbe5
--- /dev/null
+++ b/demos/component-docs/inputs/search/template.html
@@ -0,0 +1,14 @@
+<ion-navbar *navbar hide-back-button class="android-attr">
+  <ion-title>
+    Search
+  </ion-title>
+</ion-navbar>
+
+<ion-content>
+  <ion-searchbar [(ng-model)]="searchQuery"></ion-searchbar>
+  <ion-list #list>
+    <ion-item *ng-for="#item of getItems()">
+      {{item}}
+    </ion-item>
+  </ion-list>
+</ion-content>