键入时获取 Angular 4 中输入字段的值

Question

我有一个输入字段，用户可以在我的应用程序中搜索不同的用户。但是我想以这样一种方式进行搜索，即当用户输入时，它应该同时搜索。我已经实现了调用我的后端的功能，但我只想知道如何在每次击键时发送输入字段的值。请帮忙

Answer 1

您应该处理ngModelChange Angular 事件（请参阅此 stackblitz）。它考虑了输入字段中的任何类型的更改（击键、使用上下文菜单剪切/粘贴等），并忽略不会导致实际更改的击键（例如，按下和释放Shift本身不会触发ngModelChange） .

<input [ngModel]="searchStr" (ngModelChange)="modelChange($event)" />

import { Component } from "@angular/core";
import { FormsModule } from "@angular/forms";

@Component({
})
export class AppComponent {
  public searchStr: string = "";

  public modelChange(str: string): void {
    this.searchStr = str;
    // Add code for searching here
  }
}

Answer 2

(keyup)在您的输入上使用事件并将 ngModel 值传递给您的服务

<input   #term (keyup)="search(term.value)" type="text" class="form-control search-text-indent  searchbar-positioning" >

并在 component.ts

search(term: string): void {
   //pass it to your service     
}