How to use specific field in json object as data source when using ng2-completer?

Question

I am new to angular and the ng2 completer. I have an array of objects of the form

var concetps = [ { id:, code:, concept:, display: } ............ ]

I want the data source to be the display items of the array objects so I can use the auto suggest feature

I have tried googling and searching for snippets but have been unsuccessful

 <ng2-completer [datasource]="concepts" [minSearchLength]="3"  placeholder="Search" aria-label="Search"></ng2-completer>

I don't get any auto suggest when I type in the search box

Answer 1

First, you're missing [ngModel]

<ng2-completer [(ngModel)]="searchStr" [datasource]="dataService" [minSearchLength]="0"></ng2-completer>

Then, as your data is an array you need a service function to serch into it

constructor(private completerService: CompleterService) {
     this.dataService = completerService.local(this.searchData, 'color', 'color');
}

You can find complete usage and guide HERE-NG2 COMPLETER