我尝试使用ng-bootstrap的NgbTypeahead,但它没有显示带有选项的下拉列表。
我很确定我做错了什么,在搜索之后,我的input
元素将ng-reflect-ngb-typeahead="function (text) {
显示为一个属性,就好像它无法识别search
函数一样。
我在component.ts中的代码
search = (text: Observable<string>) => {
return text.pipe(
debounceTime(200),
distinctUntilChanged(),
map(term => {
console.log(this.livros.filter((v) => v.titulo.toLowerCase().indexOf(term.toLowerCase()) > -1).slice(0, 10));
term.length < 3 ? [].slice() : this.livros.filter((v) => v.titulo.toLowerCase().indexOf(term.toLowerCase()) > -1).slice(0, 10);
})
);
}
摘自component.html
<div class="row">
<div class="col-md-12">
<label for="livro-search">Digite o título do livro</label>
<input id="livro-search" type="text" class="form-control" [(ngModel)]="model" [ngbTypeahead]="search">
</div>
</div>
在运行ngOnInit
时,会填充livros
字段,因此当我尝试搜索时,它不会为空。
控制台正确地输出了结果数组,所以我知道search
函数应该可以工作。但是我不能用响应填充组件。
我使用的是:
如果有人能指出我的失败之处,我将永远感激不尽(好吧,至少在年底)。
https://stackoverflow.com/questions/52730128
复制相似问题