diff --git a/ionic/components/searchbar/searchbar.md.scss b/ionic/components/searchbar/searchbar.md.scss
index acba47956b..4133ddb09f 100644
--- a/ionic/components/searchbar/searchbar.md.scss
+++ b/ionic/components/searchbar/searchbar.md.scss
@@ -119,7 +119,7 @@ ion-searchbar {
 // Searchbar Focused
 // -----------------------------------------
 
-.searchbar-focused {
+.searchbar-focused:not(.searchbar-hide-cancel) {
   .searchbar-search-icon {
     display: none;
   }
diff --git a/ionic/components/searchbar/searchbar.ts b/ionic/components/searchbar/searchbar.ts
index fd201d895b..a050ba2620 100644
--- a/ionic/components/searchbar/searchbar.ts
+++ b/ionic/components/searchbar/searchbar.ts
@@ -39,7 +39,12 @@ export class SearchbarInput {
  *
  * @usage
  * ```html
- * <ion-searchbar [(ngModel)]="defaultSearch" (input)="triggerInput($event)" (cancel)="onCancelSearchbar($event)" (clear)="onClearSearchbar($event)"></ion-searchbar>
+ * <ion-searchbar
+ *   [(ngModel)]="myInput"
+ *   [hideCancelButton]="shouldHideCancel"
+ *   (input)="onInput($event)"
+ *   (cancel)="onCancel($event)">
+ * </ion-searchbar>
  * ```
  *
  * @demo /docs/v2/demos/searchbar/
@@ -47,9 +52,12 @@ export class SearchbarInput {
  */
 @Component({
   selector: 'ion-searchbar',
+  host: {
+    '[class.searchbar-hide-cancel]': 'hideCancelButton'
+  },
   template:
     '<div class="searchbar-input-container">' +
-      '<button (click)="cancelSearchbar()" (mousedown)="cancelSearchbar()" clear dark class="searchbar-md-cancel">' +
+      '<button (click)="cancelSearchbar()" (mousedown)="cancelSearchbar()" [hidden]="hideCancelButton" clear dark class="searchbar-md-cancel">' +
         '<ion-icon name="arrow-back"></ion-icon>' +
       '</button>' +
       '<div class="searchbar-search-icon"></div>' +