Angular - функция OnSelected не работает при вводе тегов - PullRequest
Новая
       27

Angular - функция OnSelected не работает при вводе тегов

0 голосов
/ 16 октября 2019

Я использую чипы ngx, но не могу реализовать функцию OnSelected.

В моем app.component.html у меня есть это: 

<div class="force-to-the-bottom">
  <tag-input [ngModel]="[]" 
  (onSelect)="onSelected($event)"
  (onRemove)="onItemRemoved($event)">
    <tag-input-dropdown
      [autocompleteItems]="items"
      [showDropdownIfEmpty]="true"
      [dynamicUpdate]="false"            
    >
    </tag-input-dropdown>
  </tag-input>
</div>

В моем приложенииФункции .component.ts реализованы таким простым способом: 

  onSelected($event: any) {
    console.log("Fire Selected");
  }

  onItemRemoved($event: any) {
    console.log("Fire Removed");
  }

Очень странно то, что onItemRemoved работает правильно, а onSelected не срабатывает.

Это мой StackBlitz

Я не могу понять, что я делаю неправильно.

Может ли кто-нибудь мне помочь?

Спасибо

1 Ответ

2 голосов
/ 16 октября 2019

Я думаю, вы просто путаете события onAdd и onSelect. Вероятно, вы ищете onAdd событие ngx-chips. Вот ссылка на документацию для всех выходных событий. 

<tag-input [ngModel]="[]" (onAdd)="onAdded($event)" (onSelect)="onSelected($event)" (onRemove)="onItemRemoved($event)">
    <tag-input-dropdown
      [autocompleteItems]="items"
      [showDropdownIfEmpty]="true"
      [dynamicUpdate]="false"            
    >
    </tag-input-dropdown>
  </tag-input>

И TS - 

onAdded($event: any) {
    console.log("Fire Added");
  }

Вот Stackblitz для демонстрации

если вы видите Stackblitz, ваш onSelect также работает нормально. Это просто событие, которое вызывается, когда вы нажимаете на тег после того, как он был добавлен во вход. Я не совсем понимаю название.

...