Ternary operators provide a simple mechanism for applying conditional logic to components that use data-binding.

[Bindable] private var highlighted : Boolean = false;

<mx:Button id=”someButton”
    styleName=”{highlighted ? ‘highlightButton’ : ‘normalButton’}” />


By nesting ternary operators, you are able to create chains of conditionals that would otherwise only be possible within an AS3 <Script> tag:

[Bindable] private var highlighted : Boolean = false;
[Bindable] private var highlightColor : String = “green”;

<mx:Button id=”someButton”
    styleName=”{highlighted ? (highlightColor == “green”
        ? ‘greenHighlightButton’ : ‘defaultHighlightButton’)
        : ‘normalButton’}” />


Needless to say, this is incredibly powerful.

Although if you need more than two or three nested levels I’d still recommend using a <Script> tag. Otherwise reading through the conditional logic starts to feel a bit like trying to see the sailboat in a Magic Eye picture. ;-)

Possibly related posts: (automatically generated)