Ionic 4 button ngStyle background-color

Ionic Framework
21

it’s the same as I already shared, sorry, can’t help more. hope someone will, good luck

22

All good.
I have a working version with:
<ion-button [class.catBtn]='!cat.isSelected' [class.catBtnSelected]='cat.isSelected'></ion-button>

Thanks again for all the help in this post and across the forum. With all the responses you give, you must be clones.

1 Like
23

:joy:

good to hear it worked out!

24

As of 4.0.0-Beta.8 a button’s colors can be set as so:

    --background: red;
    --color: black;
    --border-color: green;

etc…

4 Likes
25

This one worked… Thanks :slight_smile: :smile: Btw whats the significance of - - ??

26

is there any solutions?

 <ion-button fill="outline"  [ngStyle]="(category.id === addEventData.category.id)?{'background':'#00B0CA',color:'white'}:''">

                        {{category.description}}
                    </ion-button>`

this what i have used but it display as below

Before
27%20AM

After

37%20AM

27

Which version of Ionic are you using?
Test this:
[ngStyle]='3>2&&{"background":"orange"}'
That works in Version 4

28

If anyone is still looking for a simple way to do this. I am on Ionic 5.x so not sure how far back it works.

This was my solution to setting the button color dynamically

<ion-button [color]="true ? 'color1' : 'color2'">

29

how you managing isSelected in ts can i get a sample?