如何在离子搜索栏中获取用户输入的文本

Question

我正在创建一个应用程序，我想获取用户在按回车键后在搜索栏中输入的文本，并将该值分配给一个变量。我遇到的所有示例都只显示列表过滤，但我仍然卡住了。我正在尝试通过单行代码执行此操作。

<ion-searchbar placeholder="Search" type="text" id="term" ></ion-searchbar>

Answer 1

假设搜索组件是你自己的组件，不是外部库提供的。

您可以拥有一个按键事件侦听器，并将事件作为参数传递给 html 中的函数。在该功能中检查按下的键并与您要检查的键匹配。

Answer 2

没什么好做的，试试

<ion-searchbar [(ngModel)]="searchTerm" (ionInput)="searchEventFired()"></ion-searchbar>

要与 enter 一起工作，您需要做：

<ion-searchbar [(ngModel)]="searchTerm" (keydown.enter)="searchEventFired()"></ion-searchbar>

或

<ion-searchbar [(ngModel)]="searchTerm" (search)="searchEventFired()"></ion-searchbar>

在component.ts


searchTerm = '';

constructor(){}

searchEventFired() {
  // you have the value here
  console.log(this.searchTerm)
}

How to get the text input by user in ion searchbar