Hello,

thanks for your fast reply and the very good explanation.

Michi

You should not modify content of modalRef directly, instead add modal classes to the modal options. You also don't need to add modal-content and modal-dialog classes because they are added automatically in this case.

In order to make button work correctly you need to use mdbBtn directive and its inputs instead of css classes. I made some changes in your code and everything should work correctly now:

I added the code to your first post. In the future please try to include all important infromation in your question (you can always edit first post). Answer should contain only final solution for the problem.

Modal HTML:

<div id="modalPush" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
   aria-hidden="true">
<div role="document">
  <!--Content-->
  <div class="text-center">
    <!--Header-->
    <div class="modal-header d-flex justify-content-center">
      <p class="heading">{{headerText}}</p>
      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true" class="white-text">×</span>
      </button>
    </div>
    <!--Body-->
    <div class="modal-body">
      <i class="fas {{iconClass}} fa-3x animated mb-3"></i>
      <p>{{content}}</p>
    </div>
    <!--Footer-->
    <div class="modal-footer flex-center">
      <a type="button" mdbBtn [color]="btnColor" [outline]="true">{{buttonText1}}</a>
      <a mdbBtn [color]="btnColor" [outline]="true" *ngIf="buttonCount===2" type="button" waves-effect>{{buttonText2}}</a>
    </div>
  </div>
  <!--/.Content-->
</div>

Modal TS:

  headerText: string;
  iconClass: string;
  btnColor: string;
  buttonCount: number;
  modalMode: number;
  content: any
  buttonText1: string
  buttonText2: string

  constructor(public modalRef: MDBModalRef) {}

  ngOnInit() {
    this.getLayout();
  }

  public getLayout() {
    // Anzeige eines Hinweisfensters, Layout je nach Modus
    if (this.modalMode === 1) {
      this.headerText = 'Hinweis!';
      this.iconClass = 'fa-info';
      this.btnColor = 'info',
      this.buttonCount = 1;
      // TEST
    } else if (this.modalMode === 2) {
      this.headerText = 'Warnung!';
      this.iconClass = 'fa-exclamation';
      this.btnColor = 'warning',
      this.buttonCount = 2;
      //
    }
  }

Component TS (modal options):

  modalRef: MDBModalRef;

  constructor(private modalService: MDBModalService) {}

  openModal() {
    const data = {
      modalMode: 1,
      content: 'Wollen Sie sich wirklich abmelden?',
      buttonText1: 'Weiter',
      buttonText2: 'Abbrechen',
    };
    const options = {
      class: 'modal-notify modal-info',
      data: data
    }
    this.modalRef = this.modalService.show(ModalComponent, options);
  }