[flexcoders] Dynamically created component not tracking data changes

[Engkee Kwang]

In the sample code, I have a statically instantiated label that is 
bounded to data in an XML model. This label tracks changes to the XML 
data.

I then dynamically create and add new Label and using BindingUtils, 
binds the new component to the same data element. While the new 
component instance initializes to the value correctly, it does not 
track future changes to the XML?

What am I doing wrong?



<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; 
layout="absolute">

        <mx:Script>
                <![CDATA[
                        import mx.containers.FormItem;
                        import mx.controls.Label;
                        import mx.binding.utils.BindingUtils;

                        private function updateLabel(): void
                        {
                                property.general.label = input.text;
                        }
                        private function addLabel(): void
                        {
                                var lb:Label = new Label();
                                vbox.addChild(lb);
                                // I thought this is supposed 
to "bind" the property to the new label...
                                // but the new label is not "see"-ing 
changes while the first statically
                                // created label see changes
                                BindingUtils.bindProperty(lb, "text", 
this, ["property","general","label"]);
                        }
                ]]>
        </mx:Script>

        <mx:XML id="property" xmlns="">
                <property>
                        <general label="General">
                                <label label="Label" 
type="String">Foo</label>
                        </general>
                </property>
        </mx:XML>

        <mx:VBox id="vbox">
                <mx:TextInput id="input" width="300" 
text="{property.general.label}" change="updateLabel()"/>
                <mx:Button label="Add Label" click="addLabel()"/>
                <mx:Label text="{property.general.label}"/>
        </mx:VBox>

</mx:Application>