如何检测离子2中离子搜索条的聚焦和模糊事件?

awm*_*eer 6 dom-events typescript ionic2 angular

我现在正在使用ionic2来构建应用程序.我想检测搜索栏输入何时获得焦点以及何时模糊,以便我可以根据当前状态隐藏或显示某些组件.(例如,在用户点击此搜索栏时显示一些建议.)

这是我的代码:

<ion-searchbar #searchbar [(ngModel)]="searchInput"></ion-searchbar>
Run Code Online (Sandbox Code Playgroud)

但是,我发现这个组件似乎没有这两个事件.我试图添加这样的事件监听器,但它不起作用:

<ion-searchbar #searchbar [(ngModel)]="searchInput" (focus)="searchBarOnFocus()"></ion-searchbar>
Run Code Online (Sandbox Code Playgroud)

那么我可以通过其他方式实现此功能吗?

提前致谢!


ion-searchbar有两个文档: component document& api document

Hay*_*uki 26

要在搜索栏上捕捉焦点/模糊事件,您应该使用(ionFocus)和(ionBlur)而不是Angular(焦点)和(模糊).对我来说就像一个魅力!

<ion-searchbar #searchbar placeholder="Type an address" showCancelButton
               (ionBlur)="checkBlur()"
               (ionFocus)="checkFocus()"></ion-searchbar>
Run Code Online (Sandbox Code Playgroud)