# Hide or show card using ion-select

**URL:** <https://forum.ionicframework.com/t/hide-or-show-card-using-ion-select/138750>\
**Category:** ionic-v3\
**Created:** [August 17, 2018, 10:24am UTC](https://forum.ionicframework.com/t/hide-or-show-card-using-ion-select/138750 "2018-08-17T10:24:24Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![uddyvky](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/uddyvky/32/121897_2.png) [@uddyvky](https://forum.ionicframework.com/u/uddyvky)\
**Post date:** [August 17, 2018, 10:24am UTC](https://forum.ionicframework.com/t/hide-or-show-card-using-ion-select/138750/1 "2018-08-17T10:24:24Z")

</div>

Hi guys, I just wanted to know how can I hide or show a card using ion-select.  
There will be two option hide and show based on the user selection the card will be displayed.

```auto
 <ion-label>Select: </ion-label>
    <ion-select [(ngModel)]="hisho">
      <ion-option value="sw">Show</ion-option>
      <ion-option value="hd">Hide</ion-option>
    </ion-select>
  </ion-item>
<!----- The card i want to hide/show --------->
 <ion-card>

      <ion-item class="img">
       <ion-img width="80" height="80" src="..."></ion-img>
      </ion-item>

  </ion-card>

```

---

<div class="post-metadata">

**Author:** ![ramon](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ramon/32/75852_2.png) [@ramon](https://forum.ionicframework.com/u/ramon)\
**Post date:** [August 17, 2018, 1:04pm UTC](https://forum.ionicframework.com/t/hide-or-show-card-using-ion-select/138750/2 "2018-08-17T13:04:10Z")

</div>

Use \*ngIf in ion-card like this:

```auto
<ion-label>Select: </ion-label>
    <ion-select [(ngModel)]="hisho">
      <ion-option value="sw">Show</ion-option>
      <ion-option value="hd">Hide</ion-option>
    </ion-select>
  </ion-item>
<!----- The card i want to hide/show --------->
 <ion-card *ngIf="hisho=='sw'">

      <ion-item class="img">
       <ion-img width="80" height="80" src="..."></ion-img>
      </ion-item>

  </ion-card>

```

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 9:23pm UTC](https://forum.ionicframework.com/t/hide-or-show-card-using-ion-select/138750/3 "2021-07-19T21:23:04Z")

</div>

Closed on July 19, 2021, 9:23pm UTC


