How can i limit the number the typeahead results to 5 or something in Angular 4 ?
I have attached the official plunker link here. I'm not able to use |limitTo
http://embed.plnkr.co/gV6kMSRlogjBKnh3JHU3/
This is the template
<section class="col-sm-12">
<div class="search-results style-3">
<input type="text" [value]="query"
ngxTypeahead
[taUrl]="url"
[taParams]="params"
(taSelected)="handleResultSelected($event)"
>
</div>
</section>
This is ts file
export class AppComponent {
title = 'This is Angular TypeAhead v' + systemConfig.map['ngx-typeahead'].split('@')[1].split('/')[0];
public url = 'http://suggestqueries.google.com/complete/search';
public params = {
hl: 'en',
ds: 'yt',
xhr: 't',
client: 'youtube'
};
public query = '';
handleResultSelected (result) {
this.query = result;
}
generateWord() {
return chance.word();
}
}
In Angular, there is no limitTo
filter, its called SlicePipe.
Use | slice:0:3
instead of limitTo
<input type="text" ngxTypeahead [value]="query3" [taList]="staticList | slice:0:3" (taSelected)="handleStaticResultSelected($event)">
Updated plnkr: https://plnkr.co/edit/wqTHY2rHknXHF412BELQ?p=preview
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With