Модальный всплывающий компонент Bootstrap не работает при щелчке элемента угловой формы

У меня есть требование, в котором я использую множественный выбор угловой формы, которая также имеет логотип для каждой строки. При нажатии на этот логотип я хочу загрузить компонент модального всплывающего окна, я следую демонстрации Stackblitz для вызова модального компонента в app.component при нажатии элемента.

Ссылка на демонстрацию, по которой я перешел: Bootstrap modal Stackblitz Demo

Моя демонстрация обходного пути, которую я реализую, выглядит следующим образом: Демонстрация обходного пути Stackblitz

Ошибка, которую я получаю при нажатии логотипа с помощью функции openModal(), имеет неопределенное значение.

Как исправить это при работе с угловой формой?

Ниже приведен фрагмент кода:

компонент multiselect form

@Component({
selector: 'formly-field-multiselect',
template: `<br><p-multiSelect  [options] = "to.options"
  [formControl] = "formControl"
  [formlyAttributes] = "field"
  [showClear] = "!to.required" >
  <ng-template let-item pTemplate = "item">
  <div>{{item.label}}</div>
   <div>
   <i class = "pi pi-check" (click) = "to.openModal()"></i>
   </div>
  </ng-template>
</p-multiSelect>
`,
})

app.component.ts, в котором вызывается модальный компонент (calenderComponent)

fields: FormlyFieldConfig[] = [
{
  key: "select",
  type: "multiselect",
  templateOptions: {
    multiple: false,
    placeholder: "Select Option",
    options: [
      { label: "Select City", value: null },
      { label: "New York", value: { id: 1, name: "New York", code: "NY" } },
      { label: "Rome", value: { id: 2, name: "Rome", code: "RM" } },
      { label: "London", value: { id: 3, name: "London", code: "LDN" } },
      {
        label: "Istanbul",
        value: { id: 4, name: "Istanbul", code: "IST" }
      },
      { label: "Paris", value: { id: 5, name: "Paris", code: "PRS" } }
    ],
      openModal() {
         this.modalRef = this.modalService.show(CalenderComponent,  {
         initialState: {
         title: 'Modal title'
       }
  });
 }, 
 }
}