javascript - 清除 ionic 搜索栏中的文本

Question

我有一个搜索栏

<div id="search"><ion-searchbar [(ngModel)]="searchQuery" (change)="onChange($event)" (ionClear)="onCancel($event)" (ionInput)="onInput($event)" debounce="1"></ion-searchbar></div>

如何从 ts 文件中清除用户输入的文本？

这是试图清除搜索栏文本的 ts 文件函数。

.
private searchQuery: string = null;
.

  subscribeEvents() {
    this.events.subscribe('mapFilter:update', (data) => {
      this.employeeModel = data[0].employeeModel;
      if (data[0].fromClearFilters) {
        this.searchQuery = '';
      }
      this.getMarkers();
      this.getPosition();
    });
  }

this.searchQuery = ''; 确实重置了过滤器，但文本仍然存在

谢谢

我正在使用 Ionic 2

Answer 1

首先，为您的 HTML 元素添加一个标识符

<ion-searchbar #mySearchbar ...>

然后，导入ViewChild:

import { ViewChild } from '@angular/core';

然后，导入Searchbar

import { Searchbar } from 'ionic-angular';

将其添加为属性:

@ViewChild('mySearchbar') searchbar: Searchbar;

然后，触发 onInput 事件并传递一个空标识符(这样您的 onInput 事件监听器就知道是您了)

this.searchbar.clearInput(null);