<ion-row *ngIf="!favouritesorshare" >
<ion-col col-8 >
<p (click)="addToFavourites(item)">
<i class="fa fa-star-o" style="font-size:15px;" [style.color]="favouriteButtonColor" aria-hidden="true"></i>
<span [style.color]="favouriteButtonColor" class="favorites" >Add to Favourites</span>
</p>
</ion-col>
</ion-row>
<ion-row *ngIf="favouritesorshare" class="socialcolumn socialcol">
<ion-col col-12 >
<ion-segment [(ngModel)]="icons" >
<ion-segment-button value="facebook">
<i class="fa fa-facebook-square fashare" style="color: #3b5998;" aria-hidden="true"></i>
</ion-segment-button>
<ion-segment-button value="googleplus">
<i class="fa fa-google-plus-square fashare" style="color: #d34836;" aria-hidden="true"></i>
</ion-segment-button>
<ion-segment-button value="whatsapp">
<i class="fa fa-whatsapp fashare" style="color: #075e54;" aria-hidden="false"></i>
</ion-segment-button>
<ion-segment-button value="twitter">
<i class="fa fa-twitter-square fashare" style="color: #0084b4;" aria-hidden="true"></i>
</ion-segment-button>
<ion-segment-button value="instagram">
<i class="fa fa-instagram fashare" style="color:#fb3958;
" aria-hidden="true"></i>
</ion-segment-button>
<ion-segment-button value="email">
<i class="fa fa-envelope fashare" style="color: black;" aria-hidden="true"></i>
</ion-segment-button>
<ion-segment-button value="linkedin">
<i class="fa fa-linkedin fashare" style="color: blue;" aria-hidden="true"></i>
</ion-segment-button>
</ion-segment>
</ion-col>
</ion-row>
right now based favouritesorshare property i am showing different divs but i want to know if user clicks out side of second div.because i need to show first div instead of second one?