ngx-chips: невозможно показать элементы автозаполнения - PullRequest
Новая
       22

ngx-chips: невозможно показать элементы автозаполнения

1 голос
/ 05 марта 2020

В Angular я хочу показать элементы (genreName) в автозаполнении. В .html я написал следующее: 

 <tag-input [ngModel]="genre" [onlyFromAutocomplete]="true">
            <tag-input-dropdown [showDropdownIfEmpty]="false"
                                [autocompleteItems]="responseRawGenreList">
            </tag-input-dropdown>
</tag-input>

В файле .ts я написал следующие коды: 

this.commonService.getAllGenre(this.userToken).subscribe((data: any) => {
  this.responseRawGenreList = data.data;
  console.log(this.responseRawGenreList)
});

Приведенный выше код утешает результат, как показано ниже: 

[0 … 99]
0: {genreId: 4, genreName: "Action", genreDescription: "", status: "ONE"}
1: {genreId: 5, genreName: "Action", genreDescription: "", status: "ONE"}
2: {genreId: 6, genreName: "Action", genreDescription: "", status: "ONE"}
3: {genreId: 7, genreName: "ऐक्शन", genreDescription: "", status: "ONE"}

Когда я ввожу что-то в 'тег ввода' в браузере, он показывает мне следующую ошибку:

core. js: 6014 ОШИБКА TypeError: Не удается прочитать свойство 'toString' не определено в TagInputDropdown.matchingFn (ngx-chips. js: 207) в ngx-chips. js: 1216 в Array.filter () в TagInputDropdown.getMatchingItems (ngx-chips. js: 1208) в SafeSubscriber.TagInputDropdown.show [as _next] (ngx-chips. js: 1011) в SafeSubscriber .__ tryOrUnsub (Subscriber. js: 183) в SafeSubscriber.next (Subscriber. js: 122) в Subscriber._next (Подписчик. js: 72) в Subscriber.next (Подписчик. js: 49) в FilterSubscriber._next (фильтр. js: 33)

1 Ответ

1 голос
/ 05 марта 2020

Вам необходимо добавить [identifyBy] и [displayBy] и передать имя свойства.

Вы можете установить: 

identifyByProperty = 'genreId';

[identifyBy]="identifyByProperty"

или, 

identifyBy="genreId"

Попробуйте так: 

<tag-input [ngModel]="genre" [onlyFromAutocomplete]="true">
    <tag-input-dropdown [autocompleteObservable]="requestAutocompleteItems" displayBy="genreName"
        identifyBy="genreId">
    </tag-input-dropdown>
</tag-input>

Рабочая демоверсия

...