content is undefined after upgrading to ngx-bootstrap 10

Question

I show quite a few modals in my application and the way I've decided to do all the somewhat generic ones is through a modal service in typescript. The modal service takes a component as an argument and then opens the model as usual...after the upgrade the content is consistently 'undefined'

My code looks like this

import {
  Component,
  Injectable,
  ViewContainerRef
} from '@angular/core';
import {
  BsModalRef,
  BsModalService
} from 'ngx-bootstrap/modal';


@Injectable({
  providedIn: 'root'
})
export class MapModalService {
  bsModalRef: BsModalRef;
  config = {
    animated: true,
    keyboard: true,
    backdrop: true,
    ignoreBackdropClick: true
  };
  constructor(
    private modalService: BsModalService,
    private mapSettingsService: MapSettingsService) {}
  displayModal(modalComponent: any, message: any, title: string, iconType: string,
    _modalSize: string) {
    let modalSize = '';
    if ((_modalSize === MapConstants.ModalSettings.ModalSmall) || (_modalSize === '') ||
      (_modalSize === undefined)) {
      modalSize = 'modal-dialog-centered modal-sm';
    } else if (_modalSize === MapConstants.ModalSettings.ModalLarge) {
      modalSize = 'modal-lg modal-dialog-centered';
    } else if (_modalSize === MapConstants.ModalSettings.ModalMedium) {
      modalSize = 'modal-dialog-centered';
    }
    const initialState = {
      message: message,
      title: title,
      iconSize: 'xx-large',
      iconType: iconType,
      fontSize: 'x-large'
    };
    this.bsModalRef = this.modalService.show(modalComponent, Object.assign({
      class: modalSize,
      initialState
    }, this.config));
    this.bsModalRef.content.closeBtnName = 'Close';
  }

In the example above 'content' is undefined...any ideas on why or how to fix this?

Answer 1

I realized after I posted this question that the "modalComponent" that is being passed in to "displayModal" had a.toString() conversion on it.

This was the problem in that "displayModal" needs an Angular component.