0

I am using bootstrap model when I click model need to insert component to model <miniStatement></miniStatement>

miniStatement() {
    const activeModal = this.modalService.open(statementHistory, {size: 'lg'});
    activeModal.componentInstance.modalHeader = 'Mini Statement';
    activeModal.componentInstance.modalContent = `<miniStatement></miniStatement> `;
  }
}

<div class="modal-content">
  <div class="modal-header">
    <h4 class="modal-title">{{modalHeader}}</h4>
    <button class="close" aria-label="Close" (click)="closeModal()">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
{{modalContent}}
  </div>
</div>
The Hungry Dictator
  • 3,444
  • 5
  • 37
  • 53
sridharan
  • 2,011
  • 10
  • 36
  • 61
  • If this is about Angular 2 or 4 please remove the `angularjs` tag which is specific to Angular 1.x. – Günter Zöchbauer Jul 10 '17 at 09:10
  • Angular4 doesn't process HTML added dynamically. You can use `ViewContainerRef` to add a component using code. See for example https://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-with-user-click-chosen-components/36325468#36325468 – Günter Zöchbauer Jul 10 '17 at 09:12

0 Answers0