About the binding mechanism -- Flex 2.01

At compile time, the MXML compiler generates code to create ActionScript Watcher and Binding objects that correspond to the binding tags and expressions found in an MXML document. At run time, Watcher objects are triggered by change events that come from the constituent parts of binding source expressions; the Watcher objects then trigger Binding objects to execute bindings.

To ensure the best possible binding results, you should always strongly type your variables. When you use one of the standard Flex classes, such as any of the list-based classes, you should know that the selectedItem property is typed as Object. If your selectedItem is a real custom class, not a model or RPC service result, you should cast it, as the binding expression in the following example shows:

{MyClass(myList.selectedItem).someProp}

Subtopics

Working with bindable property chains

When you specify a property as the source of a data binding, Flex monitors not only that property for changes, but also the chain of properties leading up to it. The entire chain of properties, including the destination property, is called a bindable property chain. In the following example, firstName.text is a bindable property chain that includes both a firstName object and its text property:

<first>{firstName.text}</first>

You should raise an event when any named property in a bindable property chain changes. If the property is marked with the [Bindable] metadata tag, the Flex compiler generates the event for you. For more examples using the [Bindable] metadata tag, see Bindable metadata tag in Creating and Extending Flex 2 Components.

The following example shows an example that uses the [Bindable] metadata tag for a variable and a getter property and how to call the dispatchEvent() function:

[Bindable]
public var minFontSize:Number = 5;

[Bindable("textChanged")]
public function get text():String {
     return myText;
}

public function set text(t : String):void {
     myText = t;
    dispatchEvent( new Event( "textChanged" ) );}

If you omit the event name in the [Bindable] metadata tag, the Flex compiler automatically generates and dispatches an event named propertyChange so that the property can be used as the source of a data binding expression.

You should also provide the compiler with better information about an object by casting the object to a known type. In the following example, the myList List control contains Customer objects, so the selectedItem property is cast to a Customer object:

<mx:Model id="selectedCustomer">
    <customer>
        <name>{Customer(myList.selectedItem).name}</name>
        <address>{Customer(myList.selectedItem).address}</address>
        ... 
    </customer>
</mx:Model>

There are some situations in which binding does not execute automatically as expected. Binding does not execute automatically when you change an entire item of a dataProvider property.

Binding also does not execute automatically for subproperties of properties that have [Bindable] metadata, as the following example shows:

...
[Bindable]
var temp;
// Binding is triggered:
temp = new Object();
// Binding is not triggered, because label not a bindable property
// of Object:
temp.label = foo; 
...

In this code example, the problem with {temp.label} is that temp is an Object. You can solve in one of the following ways:

Binding also does not execute automatically when you are binding data to a property that Flash Player updates automatically, such as the mouseX property.

The executeBindings() method of the UIComponent class executes all the bindings for which a UIComponent object is the destination. All containers and controls, as well as the Repeater component, extend the UIComponent class. The executeChildBindings() method of the Container and Repeater classes executes all of the bindings for which the child UIComponent components of a Container or Repeater class are destinations. All containers extend the Container class.

These methods give you a way to execute bindings that do not occur as expected. By adding one line of code, such as a call to executeChildBindings() method, you can update the user interface after making a change that does not cause bindings to execute. However, you should only use the executeBindings() method when you are sure that bindings do not execute automatically.