Feature request (ionic v2): support icon and badge in ion-segment-button
See original GitHub issueShort description of the problem:
Using an icon in “ion-segment-button” breaks the CSS. Moreover, it would be convenient to have a badge system like tabs (cf #6636).
Code example :
<ion-segment light [(ngModel)]="curSegment">
<ion-segment-button value="toAccept">
<ion-icon item-left name="flash"></ion-icon>//bad render
toAccept
<ion-badge danger item-right>{{challengesToAccept.length}}</ion-badge> //bad render
</ion-segment-button>
</ion-segment>
Which Ionic Version? 2.x beta 8
Tested under android and browser.
Issue Analytics
- State:
- Created 7 years ago
- Comments:5 (2 by maintainers)
Top Results From Across the Web
support icon and badge in ion-segment-button · Issue #6957 ...
Feature request (ionic v2): support icon and badge in ion-segment-button #6957 ... Using an icon in "ion-segment-button" breaks the CSS.
Read more >ion-segment-button - Ionic Framework
ion -segment-buttons are groups of related buttons inside of a Segment. Learn to use segment button icons and check their values on Ionic...
Read more >Ionic Component Documentation
Buttons are simple components in Ionic, can consist of text, an icon, or both, and can be enhanced with a wide range of...
Read more >Is there a way to load ionic pages inside of an ionic segment?
I have three ionic pages which i am trying to display inside of ionic segments. I want to keep the functionality of the...
Read more >Ionic Segment Button Notification Badge - CodePen
Insecure Resource. The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https....
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
+1
You can do so by :