【问题标题】:NgbTypeahead selectItem get clicked item ngBootstrap angular2NgbTypeahead selectItem 获得点击的项目 ngBootstrap angular2
【发布时间】:2017-03-24 19:37:35
【问题描述】:

在这个answer 中,向我解释了使用selectItem 来获取选择事件。

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

我用

(selectItem)="search(model)"

获取事件,并在 TS 中

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

}

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

我的后台日志

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

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

【问题讨论】:

    标签: angular bootstrap-typeahead ng-bootstrap


    【解决方案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

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-02-13
    • 1970-01-01
    • 1970-01-01
    • 2021-07-30
    • 1970-01-01
    • 2012-07-05
    • 1970-01-01
    相关资源
    最近更新 更多