ngx-chips: невозможно добавить второй тег из autocompleteItems - PullRequest
Новая
       13

ngx-chips: невозможно добавить второй тег из autocompleteItems

0 голосов
/ 11 ноября 2018

Я использую ngx-chips с autocompleteItems для ввода тегов, но после добавления первого тега раскрывающийся список больше не появляется, а также ошибка console.

HTML 

<tag-input
    [ngModel]="columnsToIgnore"
    [ngModelOptions]="{standalone: true}"
    [placeholder]="'Enter variables to ignore'"
    [secondaryPlaceholder]="'Enter variables to ignore'"
    [onlyFromAutocomplete]="true"
    (onAdd)="addIgnoreColumn($event)"
    (onRemove)="removeIgnoreColumn($event)"
    theme='bootstrap'>
     <tag-input-dropdown
       [autocompleteItems]="selectedDataset.schema.columns"
       [displayBy]="'name'"
       [focusFirstElement]="true">
          <ng-template let-item="item" let-index="index">
            {{ item.name }} : {{ item.type }}
          </ng-template>
     </tag-input-dropdown>
</tag-input>

при добавлении первого tag появляется выпадающий enter image description here

но при попытке добавить второй выпадающий не появляется enter image description here

Stackblitz

1 Ответ

0 голосов
/ 11 ноября 2018

Поскольку вы используете комплекс object в качестве options, вы должны использовать identifyBy, с помощью которого ngx-chips будет сравнивать выбранные элементы с предоставленными параметрами. 

 <tag-input
    [ngModel]="columnsToIgnore"
    [ngModelOptions]="{standalone: true}"
    [placeholder]="'Enter variables to ignore'"
    [secondaryPlaceholder]="'Enter variables to ignore'"
    [onlyFromAutocomplete]="true"
    (onAdd)="addIgnoreColumn($event)"
    (onRemove)="removeIgnoreColumn($event)"
    theme='bootstrap'>
     <tag-input-dropdown
       [autocompleteItems]="selectedDataset.schema.columns"
       [displayBy]="'name'"
       [identifyBy]="'name'" <!-- use any property of object -->
       [focusFirstElement]="true">
          <ng-template let-item="item" let-index="index">
            {{ item.name }} : {{ item.type }}
          </ng-template>
     </tag-input-dropdown>
</tag-input>

Рабочая копия здесь - https://stackblitz.com/edit/angular-icraz4

...