Not Completed

Hide & Show

<div class="Cards">

<div [hidden]="!item.isShowDetail" padding="2px">

<img style="height:200px;" src="{{item.imgs}}" imageViewer /><br>

<!--<img style="height:200px;" src="{{item.imgs}}" /><br>-->

<p><b>MOLECULE:</b></p>

<p>{{item.desc}}</p>

<p><b> THERAPY SEGMENT:</b></p>

<p> {{item.vitamin}} </p>

</div>

</div>

Ts.

isShowDetail: false

getItems(ev: any) {

// Reset items back to all of the items

this.initializeItems();

// set val to the value of the searchbar

let val = ev.target.value;

// if the value is an empty string don't filter the items

if (val && val.trim() != '') {

this.productList = this.productList.filter((item) => {

return (item.title.toLowerCase().indexOf(val.toLowerCase()) > -1);

})

}

}

showDetail(item){

item.isShowDetail=!item.isShowDetail;

}

}