ngx-chips：无法从 autocompleteItems 添加第二个标签答案

【问题标题】：ngx-chips: it's not possible to add a second tag from autocompleteItemsngx-chips：无法从 autocompleteItems 添加第二个标签
【发布时间】：2019-04-14 04:05:39
【问题描述】：

我使用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 时，出现下拉菜单

但是当尝试添加第二个时，下拉菜单没有出现

Stackblitz

【问题讨论】：

你能在 stackblitz 中复制这个问题吗？
@SunilSingh 我添加了一个指向 stackblitz 的链接
添加了答案。

标签： angular typescript ngx-chips

【解决方案1】：

由于您将复杂的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

【讨论】：