# Ion-segment click

**URL:** <https://forum.ionicframework.com/t/ion-segment-click/229412>\
**Category:** Ionic Angular\
**Tags:** announcement\
**Created:** [December 9, 2022, 9:56am UTC](https://forum.ionicframework.com/t/ion-segment-click/229412 "2022-12-09T09:56:34Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![frame88](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/frame88/32/143203_2.png) [@frame88](https://forum.ionicframework.com/u/frame88)\
**Post date:** [December 9, 2022, 9:56am UTC](https://forum.ionicframework.com/t/ion-segment-click/229412/1 "2022-12-09T09:56:34Z")

</div>

I would like to change the content of a div after click on the ion-segment.  
Example:

```auto
<ion-segment value="default">
  <ion-segment-button value="default">
    <ion-label>Default</ion-label>
  </ion-segment-button>
  <ion-segment-button value="segment">
    <ion-label>Segment</ion-label>
  </ion-segment-button>
</ion-segment>

```

If I click in _Default_ I want to show a _list of motocycle_, instead if I click on _Segment_ shows a _list of cars._  
**How can I do?**

---

<div class="post-metadata">

**Author:** ![najam92](https://avatars.discourse-cdn.com/v4/letter/n/ba8739/32.png) [@najam92](https://forum.ionicframework.com/u/najam92)\
**Post date:** [December 15, 2022, 10:53am UTC](https://forum.ionicframework.com/t/ion-segment-click/229412/2 "2022-12-15T10:53:22Z")

</div>

use ionChange event on segment.

For example: `<ion-segment value="default" (ionChange)="yourChangeEvt($event)">`

```auto
yourChangeEvt(e){
e.detail.value = 'value received in event.' // coming from value attribute on segment button.
//your toggle condition for car / bike list. 
}

```

---

<div class="post-metadata">

**Author:** ![frame88](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/frame88/32/143203_2.png) [@frame88](https://forum.ionicframework.com/u/frame88)\
**Post date:** [December 15, 2022, 4:30pm UTC](https://forum.ionicframework.com/t/ion-segment-click/229412/3 "2022-12-15T16:30:16Z")

</div>

thank u sir, but it’s not completely clear. Can u make a complete example with also the array var?

---

<div class="post-metadata">

**Author:** ![frame88](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/frame88/32/143203_2.png) [@frame88](https://forum.ionicframework.com/u/frame88)\
**Post date:** [December 15, 2022, 5:25pm UTC](https://forum.ionicframework.com/t/ion-segment-click/229412/5 "2022-12-15T17:25:28Z")

</div>

I think that is the worse and unnecessary answer that a man can send.

---

<div class="post-metadata">

**Author:** ![Hills90210](https://avatars.discourse-cdn.com/v4/letter/h/57b2e6/32.png) [@Hills90210](https://forum.ionicframework.com/u/Hills90210)\
**Post date:** [December 16, 2022, 2:47pm UTC](https://forum.ionicframework.com/t/ion-segment-click/229412/6 "2022-12-16T14:47:33Z")

</div>

> [@frame88](#):
>
> I think that is the worse and unnecessary answer that a man can send.

How so? Your asking something that is very basic. Ionic provides examples in thier docs and the are many 3rd party tutorials as well. Explore solutions yourself, as it is a needed skill in software development. You wont learn anything if you ask people to do the work for you, especially something as basic as what your asking.

---

<div class="post-metadata">

**Author:** ![MozMike](https://avatars.discourse-cdn.com/v4/letter/m/dec6dc/32.png) [@MozMike](https://forum.ionicframework.com/u/MozMike)\
**Post date:** [December 27, 2022, 8:02pm UTC](https://forum.ionicframework.com/t/ion-segment-click/229412/7 "2022-12-27T20:02:54Z")

</div>

Stepping in here. I want to thank the members of the Ionic community (@najam92, @Hills90210, @mikrochipkid) for assisting with this question. Often times, routine questions with easily-discoverable answers are asked in the forum and on the Ionic Discord. While most Ionic developers are happy to point you in the right direction, asking for someone to provide a full code example for this type of question is not a good use of their time.

Perhaps this article can get you started on the right track: [ion-segment: API Documentation for Segmented Controls](https://ionicframework.com/docs/api/segment)

Good luck and please let us know if you were successful!
