Make a segment of ion-button or ion-chip

@shizi wrote:

Hello, guys !
I want to make a segment of clickable, ion-button or ion-chip like this:

help828×76 4.21 KB

The problem is how to enable the first button by default (checked) and how to change after click event, the background color of the default button, and change the background of the button who has just been clicked. Please help me. Thank you !
Here is my code:

                  <ion-col  *ngFor="let categorie of categoriesChip; let id = index">
                    <ion-button class="chip-btn"
                                [ngClass]="{'default': defaultActivate(id)}" 
                                (click) = "changeButton($event)"
                                fill="outline">
                      {{categorie.label}}
                    </ion-button`
                  </ion-col>
                </ion-row>

Here the typeScript code:

defaultActivate(id)  {

  		if(id === 0) {

  			return true;
  		}
  	}

Posts: 1

Participants: 1

Read full topic