using_data_binding

Binding expressions in curly braces can contain an ActionScript expression that returns a value. For example, you can use the curly braces syntax for the following types of binding:

• A single bindable property inside curly braces
• String concatenation that includes a bindable property inside curly braces
• Calculations on a bindable property inside curly braces
• Conditional operations that evaluate a bindable property value

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    viewSourceURL="src/DataBindingActionScriptExpressionsSimple/index.html"    
    width="420" height="350"
 >
    <mx:Model id="myModel">

        <myModel>
            <!-- Perform simple property binding. -->
            <a>{nameInput.text}</a>
            <!-- Perform string concatenation. -->
            <b>This is {nameInput.text}</b>

            <!-- Perform a calculation. -->
            <c>{(Number(numberInput.text) as Number) * 6 / 7}</c>

            <!-- Perform a conditional operation using a ternary operator;
                the person object contains a Boolean variable called isMale. -->
            <d>{(isMale.selected) ? "Mr." : "Ms."} {nameInput.text}</d> 
        </myModel>

    </mx:Model>

    <mx:Panel 
        paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10"

        width="100%" height="100%"
        title="Binding expressions"
    >
        <mx:Form>
            <mx:FormItem label="Last Name:">

                <mx:TextInput id="nameInput"/>
            </mx:FormItem>            
            <mx:FormItem label="Select sex:">
                <mx:RadioButton 
                    id="isMale" 
                    label="Male" 
                    groupName="gender"

                    selected="true"
                />
                <mx:RadioButton 
                    id="isFemale" 
                    label="Female" 
                    groupName="gender"

                />
            </mx:FormItem>
            <mx:FormItem label="Enter a number:">
            <mx:TextInput id="numberInput" text="0"/>

            </mx:FormItem>            
        </mx:Form>
        
        <mx:Text text="{'Simple binding: '+myModel.a}"/>
        <mx:Text text="{'String concatenation: '+myModel.b}"/>

        <mx:Text text="{'Calculation: '+numberInput.text+' * 6 / 7 = '+myModel.c}"/>        
        <mx:Text text="{'Conditional: '+myModel.d}"/>

    </mx:Panel>    
</mx:Application>