1

I have a modal which has a form. At a point I need to show another modal for user to select items and update the view of first modal with the selected items . How can I do that. I have to show both modals at the same time.

Below is my code snippets ..

<button class="btn btn-primary btn-xs" (click)="openContactModal()">Add
         Contact</button>
<modal #myModal
   modalClass="modal-md"
   [closeOnEscape]="false"
   [closeOnOutsideClick]="false"
   [hideCloseButton]="true"
>
 <modal-header>
  <h6>Contact</h6>
 </modal-header>

  <modal-content>

   <button class="btn btn-primary btn-xs"   (click)="openContactModal2()">TestModal2</button>

     </modal-content>

<modal #myModal2
   modalClass="modal-md"
   [closeOnEscape]="false"
   [closeOnOutsideClick]="false"


 <modal-content>


   <ul *ngFor="let type of types">
     <li>{{type}}</li>

  </ul>
    <p> I am in modal two  and I will select types though they are list   here</p>

the selcected types should be seen in other modal


My components does open both modal from code as:

@ViewChild('myModal') myModal: Modal;
@ViewChild('myModal2') myModal2: Modal;

openContactModal() {
    this.myModal.open();
  }

openContactModal2(types) {
  this.myModal2.open(types);
 }

The problem is once I open modal 2 , 1 gets closed. I got some solution with jquery to fix that in this. But I am not sure about implementing in angular 2. Is there any easy solution for this. Sorry to provide incomplete code as I can't do.

Community
  • 1
  • 1
santosh
  • 140
  • 1
  • 13

1 Answers1

2

One way is to use a 'sessionState' service to store the data that need to be passed between the 2 modals.

The 'sessionState' service should be injected into the Modals which therefore would have access to it and could use it as an object to exchange data.

I hope it helps

Picci
  • 16,775
  • 13
  • 70
  • 113
  • Hi @Picci Thanks. It is required to show modals side by side. I am able to get data and save. But I am not able to show bothn modal at a time. The moment I open one , the previous closes. – santosh Mar 14 '17 at 11:46
  • It is difficult to say anything without seeing all the code – Picci Mar 14 '17 at 13:12