favorite
I have a string property with values like “primary”, “secondary” or “danger”. I am able to bind it to a badge in this way:
<ion-badge class="badge badge-{{product.colorStock}}">1</ion-badge>
But I am not able to do the same with a label (this does NOT work):
<ion-label class="label label-{{product.colorStock}}">Text</ion-label>
How could I bind my property to the label so it changes its color?
Thank you
psyche
2
Try using ‘ng-class’ instead of writing properties for regular classes. Here’s the Angular documentation on ng-class.
Cheers!
I have tested it, and it does not work with ng-class too. Any other suggestion?
By the way, with badges instead of labels, it works with simple class but not with ng-class.
Thank you
A bit unwieldy, but should work:
<ion-label
[attr.primary]="product.colorStock == 'primary' ? '' : null"
[attr.secondary]="product.colorStock == 'secondary' ? '' : null"
[attr.danger]="product.colorStock == 'danger' ? '' : null">
Text
</ion-label>
1 Like
I have tested it, but I am afraid it does not work too…
Thank you anyway
Please double-check things, because I verified that the fundamental concept works on a scratch project.
Your are right… SORRY. I have checked it again and it was my project fault!! SORRY.
Luffy
8
<ion-badge [ngClass]="'badge-' + product.colorStock">{{product.text}}</ion-badge>
should work
1 Like
Yes, with badges it works, but with labels it does NOT work.
Thank you