circle

export class HomePage {
  oo:boolean=false;

    constructor(public navCtrl: NavController,
      public  navParams: NavParams,
      public  plt: Platform,
      private ref:ChangeDetectorRef,
      public  dp: DataProvider,
      public  http: Http,
      public  htttp:HttpClient,
      private networkinterface:NetworkInterface,
      private storage:Storage,
      public  loading:LoadingController,
      public  alertctrl:AlertController,
      public  ev:Events,
    ){
      this.oo=true;
    }

    openNavDetailsPage(index:number) {
     let id =index;
       this.oo=true;
        console.log("this.oo in open = "+this.oo)
          setTimeout(() => {
          this.oo=false;
          console.log("this.oo in open in= "+this.oo)
          },3000);
    }
}

--------------------------
<ion-content >  
    <ion-list no-lines> //this is dynamical button
      <button ion-item *ngFor="let item of irislist; let i = index;" style="height:60px;border-bottom: 1px grey solid;" (click)="openNavDetailsPage(i)" icon-start> 
        <img src="./assets/imgs/IRIS_s.png"  style="width:8vmin;height:8vmax;padding-bottom: 5px;" item-start> 
        {{item.title}} {{item.room}} {{item.No_IP}}
      </button>
    </ion-list>
</ion-content> 

<div class="use-absolute" *ngIf="oo">
    <ion-spinner ></ion-spinner>
</div>