ng4-autocomplete如何在angular 4中使用它在控制台中给我错误

时间:2018-08-30 07:39:08

标签: angular autocomplete

我正在使用ng4-autocomplete,这给了我错误,这是我的代码。

public list = [
    {title: 'Option', id: '1'},
    {title: 'Options', id: '2'},
    {title: 'Optiond', id: '3'},
    {title: 'Optiona', id: '4'},
    {title: 'Optione', id: '5'}
];

constructor(public autoCompleteService: AutoCompleteService ) 
{
    this.setList(this.list);
}

setList(list){
    this.autoCompleteService.filterName = "title";
    this.autoCompleteService.setDynamicList(list);
}

它在控制台中给我以下错误。请查看我在做什么错。

错误:错误:发现对象列表!请提供filterName以从对象中提取

这是我的html

<input type="text" [list-length]="10" filterName="title" [word-trigger]="2" no-record-text="No Records Found!" class="form-control" id="list" [ng4-auto-complete]="list">

3 个答案:

答案 0 :(得分:0)

我从未使用过该模块。 bur快速阅读文档似乎是问题在于您在模板和服务中设置了filterName机器人。

我将使用setList()方法删除

setList(list){
  this.autoCompleteService.setDynamicList(list);
}

无论如何,请尝试运行示例

答案 1 :(得分:0)

我从ng4-auto-complete检查了软件包更新。它们不再受支持。建议去PrimeNg

答案 2 :(得分:0)

  

这是实现它的一种较短方法:

public list = [
        {title: 'Option', id: '1'},
        {title: 'Options', id: '2'},
        {title: 'Optiond', id: '3'},
        {title: 'Optiona', id: '4'},
        {title: 'Optione', id: '5'}
    ];

    constructor(public autoCompleteService: AutoCompleteService ) 
    {
         let result = this.list.map(a => a.title);//this will solve your error 
         this.autoCompleteService.setDynamicList(result);
    }