<ion-header>
  <!-- <button class="nav_btn nav_back floatLeft">
  <ion-back-button>
  </ion-back-button>
  </button> -->
  <div class="nav_title floatLeft">
  <h4>Add Immunization</h4>
  </div>
  <div class="clear"></div>
 </ion-header>
 <ion-content>
  <div class="list_wrapper">
  <ul *ngIf="immunization_data">
  <li *ngFor="let immunization of immunization_data; let i=index ">
  <div class="list_main" (click)="toggleGroup(i)" [ngClass]="{active:isGroupShown(i)}">
  <div class="col floatLeft">
  <p>Type</p>
  <h3><strong>{{immunization.type}}</strong></h3>
  </div>
  <!-- <div class="col floatLeft borderNone">
  <p>Expiry Date</p>
  <h3>06/12/2019</h3>
  </div> -->
  <div class="clear"></div>
  </div>
  <div class="list_sub" *ngIf="isGroupShown(i)">
  <div class="list_bar">
  <div class="col floatLeft">
  <p>Last Administered Date</p>
  <h3>{{immunization.last_adminstered_date}}</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Status</p>
  <h3>{{immunization.status}}</h3>
  </div>
   <div class="clear"></div>
  </div>
  <!-- <div class="list_bar">
  <div class="col floatLeft">
  <p>Tme of first medication</p>
  <h3>06/11/2019 11:00 AM</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Quantity Available</p>
  <h3>20</h3>
  </div>
  <div class="clear"></div>
  </div> -->
  </div>
  </li>
  <!-- <li>
  <div class="list_main" (click)="toggleGroup(1)" [ngClass]="{active:isGroupShown(1)}">
  <div class="col floatLeft">
  <p>Name</p>
  <h3><strong>Medication Authorizations</strong></h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Expiry Date</p>
  <h3>06/12/2019</h3>
  </div>
  <div class="clear"></div>
  </div>
  <div class="list_sub" *ngIf="isGroupShown(1)">
  <div class="list_bar">
  <div class="col floatLeft">
  <p>Name of medicine</p>
  <h3>Potassium Chloride</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Times Per Day</p>
  <h3>2 Days</h3>
  </div>
  <div class="clear"></div>
  </div>
  <div class="list_bar">
  <div class="col floatLeft">
  <p>Tme of first medication</p>
  <h3>06/11/2019 11:00 AM</h3>
  </div>
  <div class="col floatLeft borderNone">
  <p>Quantity Available</p>
  <h3>20</h3>
  </div>
  <div class="clear"></div>
  </div>
  </div>
  </li> -->
  </ul>
  </div>
 </ion-content>
 