angular 4 JSON 对象的预输入反应形式数组

Question

我有一个表单，其中有一个输入字段，需要提前输入。我从我的 API 调用中得到一个 JSON 对象数组：

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 ...

当我开始打字时，我怎样才能得到 show/suggest 和 first_name 和 last_name 的输入？

Answer 1

您的数组是自定义数组，因此您需要指定要在打字头中显示的键

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

你需要使用 typeaheadOptionField 并且这里你需要给键名 where is value 所以这里你必须使用 first_name

angular 4 JSON 对象的预输入反应形式数组

angular 4 typeahead reactive form array of JSON object

arrays

object

typeahead

angular

angular-reactive-forms