Searchbar - search on 'enter' key

Issue

I'm very new to Ionic framework.
Following the docs I created a searchbar like this:

<ion-searchbar
      [(ngModel)]="searchQuery"
      [showCancelButton]="true"
      (ionInput)="search($event)">
</ion-searchbar>

ionInput When the Searchbar input has changed including cleared.

This works as expected.

However I want a different behaviour. I don't want to trigger search($event) every time the input changes, but I couldn't find an output event that is emitted when the user hits the 'enter' key or clicks a button for example.

Is there a solution for this behaviour?

Solution

You should be able to add Angular 2 keyup bindings to elements such as keyup and click

Template:

<ion-searchbar #q
      [showCancelButton]="true"
      (keyup.enter)="search(q.value)">
</ion-searchbar>

Component TS:

search(q: string) { 
    console.log(q); 
}

Answered By - Alexander Staroselsky