<div class="nav_header">
  <button class="nav_btn nav_back floatLeft" (click)="goBack()">
    <img src="../assets/Group17_2.png" />
  </button>
  <div class="nav_title floatLeft">
    <h4>Address</h4>
  </div>
  <div class="clear"></div>
</div>

<ion-content>
  <div class="address-wrapper" *ngIf="addressService.addressList">
    <ion-grid *ngFor="let address of addressService.addressList; let i = index">
      <ion-row>
        <ion-col size="1">
          <input
            type="radio"
            id="address_{{i}}"
            class="address-radio"
            name="address"
            [checked]="address.defaultVal == 1"
          />
        </ion-col>
        <ion-col size="9">
          <h1>{{address.addressType}}</h1>
          <h1>{{address.address}}</h1>
          <p>{{address.building}}, {{address.landmark}}</p>
        </ion-col>
        <ion-col size="2" [hidden]="address.defaultVal == 1"
          ><button
            class="show-btn"
            (click)="addressService.deleteAddress(address.addressId)"
          >
            <img src="../../assets/delete.png" /></button
        ></ion-col>
      </ion-row>
    </ion-grid>
    <div class="address-btn-wrapper">
      <button class="show-btn" (click)="goToPage('nearby')">
        Add New Address
      </button>
    </div>
  </div>
</ion-content>
