ionic2 searchbar in form


#1

I’m using a searchbar within a form. Its great for filtering lists etc, but seems to break the form’s submit handler. By the time ngSubmit fires, the searchbar’s contents have been cleared & I end up submitting nothing.

Here’s the markup:

<form (ngSubmit)='searchForTerm()'>
  <ion-searchbar (input)='filterOnTerm($event)'
    (clear)='cancelTerm()'
</form>

And the general idea of the typescript:


filterOnTerm(event){
    //filter stuff
   this.term = event.value;
}

searchForTerm(){
  searchSvc.byTerm(this.term);
}

cancelTerm(){
  this.term = "";
}

Some debugging clearly shows that the searchbar’s change events are handled prior to the submit action, which means the term is wiped. Any advice on reordering these would be appreciated.