Удалить / закрыть панель поиска в Angular или Ioni c 5 при нажатии кнопки отмены

Question

Я использую Ionic на мобильном устройстве и хочу убедиться, что , когда вы нажимаете кнопку отмены, панель поиска полностью удаляется . Еще лучше: когда вы попадаете в любую область за пределами строки поиска. Я уже показываю панель поиска после щелчка по значку.

   <ion-searchbar
            *ngIf="toggled"
            placeholder="Search"
            inputmode="text" type="text"
            [(ngModel)]="searchTerm" mode="ios"
            (ionChange)="onSearchChange($event)"
            (ionCancel)="showDefaultBar()"
            (ionBlur)="showDefaultBar()"
            showCancelButton="always"
            [debounce]="250"
            animated="true">
</ion-searchbar

Вот код. Итак, вы можете видеть, что кнопка отмены всегда отображается. Проблема в том, что когда вы нажимаете «Отмена», очищается только поле ввода текста, но фактически не отменяется панель поиска. Я хотел бы убедиться, что панель поиска скрыта / удалена после нажатия кнопки «Отмена», как на нативном iOS.

Есть ли способ сделать это? Не удалось найти ничего в документах Ioni c.

Answer 1

В файле .ts это можно сделать с помощью функции showDefaultBar():

showDefaultBar() {
  this.toggled = false;  <-- add this line
  ...
}