How to change the content based on the segment-button click

Ionic Framework
1

I created 2 segment buttons and I need to change the content based on the click of the segment button.plz, provide the code snippet as an example. I using ionic4 with angular

2

We need to see some code and how your HTML looks like for better understanding.

3

i solved myself by googling.

<ion-segment [(ngModel)]="status">
                <ion-col col-3>
                    <ion-segment-button color="primary" value="on">
                        <ion-label>Ongoing</ion-label>

                    </ion-segment-button>
                </ion-col>
                <ion-col col-3>
                    <ion-segment-button   value="up">
                        <ion-label>Upcoming</ion-label>

                    </ion-segment-button>
                </ion-col>
            </ion-segment>

            <ion-icon id="filter" name="switch"></ion-icon>

        </ion-row>
    </ion-grid>

   
     
    <div [ngSwitch]="status">
         <ion-grid *ngSwitchCase="'on'">
                 <ion-row>
                     <ion-col>
                         <ion-card>
                            <ion-card-title text-center>

                              sample
                            </ion-card-title>
                         </ion-card>

                         <ion-card >
                              <ion-card-title  text-center>
  
                                sample
                              </ion-card-title>
                           </ion-card>


                           <ion-card   >
                                 <ion-card-title text-center>
     
                                   sample
                                 </ion-card-title>
                              </ion-card>


                              <ion-card >
                                    <ion-card-title text-center>
        
                                      sample
                                    </ion-card-title>
                                 </ion-card>


                                
                     </ion-col>
                     
                 </ion-row>
         </ion-grid>
     
         <ion-grid *ngSwitchCase="'up'">
             <ion-row>
                 <ion-col>
                     <ion-card  >
                           <ion-card-title>

                             Kofluence
                           </ion-card-title>
                        </ion-card>


                        <ion-card >
                              <ion-card-title text-center>
  
                                sample
                              </ion-card-title>
                           </ion-card>
                 </ion-col>
             </ion-row>
     </ion-grid>



</div>

Thanks.