Question

我的component.html

<input formControlName="location" [typeahead]="states" typeaheadOptionsLimit="7" typeaheadMinLength="4" placeholder="Please enter your postcode" 
                class="form-control" (keyup)="postcodeChanged()">

这位于表单中，您可以看到我在用户输入邮政编码时添加了(keyup)的其他事件，调用了.ts文件，如下所示：

postcodeChanged() {

    var enteredPostcode = this.editProfileForm.value['location'];

    if (enteredPostcode.length == 4) {

        this.states = [];

        this.service.getLocation(enteredPostcode).subscribe(response => {

            response.forEach(entry => {
                this.states.push({
                    id: entry.Id, description: entry.Description
                });
            })


            console.log('states value is', this.states);

        });
    }

}

此方法调用连接到Firebase的服务，并检索与提供的邮政编码匹配的位置。当我console.log('states value is', this.states);时，我看到了正确的值，但是typehead下拉列表允许最终用户选择其地址不会出于某种原因。

this.states在public states: Options[] = [];文件的顶部声明为.ts。我不确定为什么这不会开火？数组已填充，states

中引用了.html

有人能发现我错过的东西吗？

更新

设置

输入字段上的

[typeaheadWaitMs]="800"似乎已经完成了这个技巧，但是我知道这是异步过程，所以如果有人可以帮我解决这个问题，让它变得更清洁而不是延迟调用它会很棒。

Angular2 - 未出现的Typehead选项

0 个答案: