How can I capture NgbTypeahead SelectedItemEvent?

Question

I want to run some custom logic on item selection from typeahead. I am unable to bind selected item event with typeahead control. I am using ng-bootstrap (bootstrap4).

<input type="text" [(ngModel)]="model" [ngbTypeahead]="search" placeholder="Search" [resultTemplate]="rt"  [inputFormatter]="formatter" />

Answer 1

You can bind to the selectItem output of the ngbTypeahead

<input type="text" class="form-control" (selectItem)="itemSelected($event)" [(ngModel)]="model" [ngbTypeahead]="search" [resultTemplate]="rt" [inputFormatter]="formatter" />

This would go in your component class:

itemSelected($event) {
    alert($event.item.name);
  }

Here is a working plunker: plunker