ng4-autocomplete, как использовать его в angular 4, выдает ошибку в консоли - PullRequest
Новая
       9

ng4-autocomplete, как использовать его в angular 4, выдает ошибку в консоли

0 голосов
/ 30 августа 2018

Я использую ng4-автозаполнение, которое выдает ошибку, вот мой код. 

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 голосов
/ 30 августа 2018

Я проверил обновление пакета с ng4-auto-complete. Они больше не поддерживаются. Предлагаю перейти на PrimeNg .

0 голосов
/ 19 декабря 2018

Вот более короткий способ достижения этого: 

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);
    }
0 голосов
/ 30 августа 2018

Я никогда не использовал этот модуль. Но, быстро читая документацию, кажется, проблема в том, что вы устанавливаете filterName бота в шаблон и сервис.

Я бы пошел, чтобы удалить в setList() метод 

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

В любом случае, пожалуйста, попробуйте запустить пример

...