NgbTypeahead selectItem 获取点击项 ngBootstrap angular2

Question

在这个中，有人向我解释了使用 selectItem 来获取 select 事件。

但是此时，我绑定到文本框的模型仍然是用户输入的原始文本，而不是select项。

我用

(selectItem)="search(model)"

获取事件，并在TS

search(model) { 
this._service.search(model).subscribe(
  results => this.results = results,
  error => this.errorMessage = <any>error);

}

但如上所述，它使用用户输入的文本调用我的后端，而不是预先输入的 selected 项目的全文。

我的后台日志

2017/03/24 20:44:14 /api/typeahead/ok
2017/03/24 20:44:14 /api/search/ok

第二个应该是 /api/search/$actualSelectedItem.

Answer 1

您应该使用 $event 来获取选定的项目，如下所示

<input type="text" class="form-control" (selectItem)="selectedItem($event)" [(ngModel)]="model" [ngbTypeahead]="search" [resultFormatter]="formatter" />
<hr>
<pre>Model: {{ model | json }}</pre>
clicked item {{clickedItem}}

你的方法应该是

selectedItem(item){
    this.clickedItem=item.item;
    console.log(item);
  }

LIVE DEMO

NgbTypeahead selectItem 获取点击项 ngBootstrap angular2

NgbTypeahead selectItem get clicked item ngBootstrap angular2

bootstrap-typeahead

ng-bootstrap

angular