Плагин Select2 в ngx-smart-modal не работает

Question

Я использую плагин select2 для выбора в угловом проекте.Когда я добавляю свой выпадающий компонент в форме или в модале начальной загрузки, все работает как положено.Но я решил использовать ngx-smart-modal , и когда я добавляю тот же компонент в этот модал, он не работает.На самом деле похоже, что он удаляет тег span для select2.

здесь ссылка stackblitz

Answer 1

Проблема не в библиотеке, а в самом коде компонента:

onModalOpen() {
    setTimeout(() => {
      $('.js-example-inside').select2({
        placeholder: "inside modal"
      });
    });
  }

Вам необходимо запустить (с setTimeout в моем примере) новый Цикл угловой проверки (ловушки жизненного цикла) для ожидания отображения модального содержимого и его доступности в DOM.Элемент, на который вы пытаетесь нацелить select2(...), еще не был доступен, поэтому он не работал.

Таким образом, фиксированный код выглядит следующим образом:

  onModalOpen() {
    setTimeout(() => {
      $('.js-example-inside').select2({
        placeholder: "inside modal"
      });
    });
  }

Вот фиксированный стек .