Dynamically change styles on Ionic 3 buttons

@obinnae wrote:

I have 5 round, outlined buttons, each with a number in it (1,2,3,4,5). If I tap any of the buttons, I want the style to change from outlined to regular (non-outlined). If I tap another button, the previous one goes back to outlined while the tapped one changes to regular.

How can I achieve that?

Here’s my HTML code

<ion-col col-4 *ngFor="let c of arrCredits">
   <button ion-button round [outline]="c.key != chosen" (click)="choosecredits(c)">${{c.key}}</button>
</ion-col>

and .ts code

ionViewDidLoad() {
//... other stuff

this.arrCredits = [{key:1}{key:2}{key:3}]
}
//... other stuff
choosecredits(c)
{ this.chosen = c.key;
}

As you can see, I was assuming each button had its own key, so that tapping a different button would change ‘chosen’, so that outline wouldn’t show in the chosen one, but that doesn’t work.

Thanks.

Posts: 1

Participants: 1

Read full topic