I'm now using ionic2 to build an app. I want to detect when the searchbar input get focus and when it blur so that I can hide or show some components according to the current status. (For example, show some suggestions when the user clicks this searchbar.)
This is my code:
<ion-searchbar #searchbar [(ngModel)]="searchInput"></ion-searchbar>
However, I found that this component seems don't have these two events.I have tried to add an event listener like this, but it didn't work:
<ion-searchbar #searchbar [(ngModel)]="searchInput" (focus)="searchBarOnFocus()"></ion-searchbar>
So can I implement this feature in some other ways?
Thanks in advance!
There are two documents for ion-searchbar: component document & api document
To catch focus / blur events on searchbar you should use (ionFocus) and (ionBlur) instead of Angular's (focus) and (blur). Works like a charm for me!
<ion-searchbar #searchbar placeholder="Type an address" showCancelButton
(ionBlur)="checkBlur()"
(ionFocus)="checkFocus()"></ion-searchbar>