массив 4-х угловых реактивных форм JSON-объекта

Question

У меня есть форма, в которой есть поле ввода, которое принимает заголовок. Я получаю массив объектов JSON из моего вызова API:

allPeople = [{"id":1,"first_name":"Abba","last_name":"Lee","current_position":"Travel Expert"}, {"id":2,"first_name":"Abbey","last_name":"Joe","current_position":"water keeper"}]    

но когда начинаю печатать, я просто получаю [object object]

Вот что у меня сейчас:

<input formControlName="person" [typeahead]="allPeople" [typeaheadOptionsLimit]="10" [typeaheadMinLength]="0" type="text">   

Я пытался:

<input formControlName="person" [typeahead]="inf as inf.first_name for inf in allPeople | filter:{first_name:$viewValue}" [resultFormatter]="formatMatches" [inputFormatter]="formatMatches"  [typeaheadOptionsLimit]="10" [typeaheadMinLength]="0" type="text">   

Но я получаю ошибку:

Uncaught Error: Template parse errors:
Parser Error: Unexpected token 'as' at column 5 in [inf as inf.first_name for inf in allPeople | filter:{first_name:$viewValue}] in ...   

Как я могу получить ввод, чтобы показать / предложить мне имя и фамилию, когда я начну печатать?

Answer 1

Ваш массив является пользовательским массивом, поэтому вам нужно указать, какой ключ нужно отображать в заголовке

<input [(ngModel)]="customSelected"
       [typeahead]="allPeople"
       typeaheadOptionField="first_name"
       class="form-control">

Вам нужно использовать typeaheadOptionField, и здесь вам нужно указать имя ключа, где находится значение, поэтому здесь вы должны использовать first_name