В typeahead-template.html
вместо использования следующего шаблона:
<ng-template #rt let-r="result" let-t="term">
<img [src]="'https://upload.wikimedia.org/wikipedia/commons/thumb/' + r['flag']" width="16">
{{ r.name}}
</ng-template>
Вы можете использовать этот шаблон:
<ng-template #rt let-r="result" let-t="term">
<img [src]="'https://upload.wikimedia.org/wikipedia/commons/thumb/' + r['flag']" width="16">
<ngb-highlight [result]="r.name" [term]="model"></ngb-highlight>
</ng-template>
При этом используется директива ngb-highlight
, предоставляемая ng-bootstrap, чтобы выделить вхождения поиска в результатах typeahead.
Пожалуйста, посмотрите этот Plunker для рабочего демо.