Чтобы отобразить раскрывающийся список в компоненте «Автозаполнение чипов» при прикосновении к нему

Question

Я использую компонент Chips Autocomplete , когда я касаюсь компонента Chips Autocomplete в первый раз, он показывает раскрывающийся список, и если Я выбираю любой вариант из раскрывающегося списка и снова касаюсь поля компонента Chips Autocomplete , в котором не отображается раскрывающийся список, пока мы что-то не введем. Разве мы не можем изменить это поведение по умолчанию?

и еще одна проблема: если я наберу что-то в поле поиска и нажму клавишу ввода, это отобразит эти данные на экране. Я хочу отобразить данные, присутствующие только в списке . Вот ссылка stackblitz .

Answer 1

Попробуйте поставить только доступных игроков:

DEMO

  add(event: MatChipInputEvent): void {
    const input = event.input;
    const value = event.value;
    // Add our fruit
    if ((value || '').trim() && this.allFruits.indexOf(value) > -1) {
      this.fruits.push(value.trim());
    }

    // Reset the input value
    if (input) {
      input.value = '';
    }

    this.fruitCtrl.setValue(null);
  }

Answer 2

используйте blur() для этого

  selected(event: MatAutocompleteSelectedEvent): void {
    this.fruits.push(event.option.viewValue);
    this.fruitInput.nativeElement.value = '';
    this.fruitCtrl.setValue(null);
    this.fruitInput.nativeElement.blur()
  }