Skip to content
This repository was archived by the owner on Oct 2, 2019. It is now read-only.

Proposal of a way to change the class and style of tags, selected choice and available choices#2007

Open
aurelienlt wants to merge 2 commits intoangular-ui:masterfrom
aurelienlt:color
Open

Proposal of a way to change the class and style of tags, selected choice and available choices#2007
aurelienlt wants to merge 2 commits intoangular-ui:masterfrom
aurelienlt:color

Conversation

@aurelienlt
Copy link
Copy Markdown

Despite having been discussed, no way to change tag colors has never been implemented yet. Therefore I've implemented a method for my usage, and tried to make it as generic and simple as possible. Here is my proposal.

I've created 4 new attributes:

  • ui-match-class and ui-match-style in <ui-select-match> in order to change the class and style of the tags (multiple case) or the selected choice (single case). They can use the scope variables $match.active and $match.locked to have a more flexible behavior.
  • ui-choice-class and ui-choice-style in <ui-select-choice> in order to change the class and style of the available choices. They can use the scope variables $choice.active and $choice.disabled to have a more flexible behavior.

It is totally retro-compatible (the behavior is unchanged if they are absent), and compatible with every theme (except for the selected choice with the serialize theme). It is especially largely compatible with bootstrap tags, with whom the btn-xxx classes can be used. It is from far simple enough for most usages.

All features can be tested in this plunkr: http://plnkr.co/edit/gq04wJ9C0iaaLA87Pfxg

@Jefiozie Jefiozie self-requested a review June 5, 2017 14:41
@aurelienlt
Copy link
Copy Markdown
Author

I have improved the merging of user classes and default classes: it is especially now fully compatible with ng-class attribute style, and default classes can be disabled.
I have also commented much more my code.

I've updated my plunkr with the new features: http://plnkr.co/edit/gq04wJ9C0iaaLA87Pfxg?p=preview

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant