首页 > 解决方案 > Ngx 芯片填充不显示动态提供的“名称”或“ID”

问题描述

我正在使用ngx-chips下面的代码来填充建议tag-input字段。

<div *ngFor="let field of fields; let i=index">
    <label class="pt-3 font-600">{{field.label}} {{field.id}}</label>
    <tag-input
      [identifyBy]="'id'"
      [inputClass]="riProSuggestionField"
      [displayBy]="'name'"
      (onFocus)="onFocusInput($event)"
      [placeholder]="field.placeholder"
      [(ngModel)]="field.data"
      [inputId]="field.id"
      [onlyFromAutocomplete]="true"
      name="{{field.label}}"
    >
      <tag-input-dropdown
      [autocompleteObservable]="getSuggestions"

      </tag-input-dropdown>
    </tag-input>
  </div>

在上面的代码中,我有多个字段,我正在通过执行填充它ngFor,在执行此操作时,我尝试为每个标签输入使用不同的名称,因为我必须为每个单独的输入标签获取不同的字段数据。只autoCompleteObservable调用一个函数getSuggestions,该函数将根据当前关注的领域工作。

我的.ts代码是获取已单击的输入是

onFocusInput(data) {
    const focusedElement = document.getElementsByClassName('ng2-tag-input--focused');
    console.log('Focused element', focusedElement);
  }

我想得到专注的名字,<tag-input></tag-input>以便我可以getSuggestions根据这个名字。

标签: htmlangulartypescriptautocompletengx-chips

解决方案


推荐阅读