[FlexJS] Uncaught type exception

[Justin Mclean]

Hi,

I trying something perhaps a little too complex fro FlexJS. First off does 
FlexJS support binding on setters/getters yet?

I have this code:
<?xml version="1.0" encoding="utf-8"?>
<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
               xmlns:js="library://ns.apache.org/flexjs/basic"
               xmlns:comp="components.*">

   <js:valuesImpl>
       <js:SimpleCSSValuesImpl/>
   </js:valuesImpl>
   <js:initialView>
       <js:View id="base" percentWidth="100" percentHeight="100">
            <comp:Box no="3" colour="red" />
       </js:View>
   </js:initialView>
</js:Application>

And this component:

<?xml version="1.0"?>
<js:Container xmlns:fx="http://ns.adobe.com/mxml/2009"; 
xmlns:js="library://ns.apache.org/flexjs/basic">

   <js:beads>
     <js:ContainerDataBinding />
   </js:beads>

   <fx:Script><![CDATA[

       protected var _colour:String;

       [Bindable]
       public var no:int;

       [Bindable]
       public function set colour(colour:String):void {
           bigBox.style = "background-color:" + colour + ";text-align:center;";
       }

       [Bindable]
       public function get colour():String {
           return _colour;
       }
       ]]></fx:Script>

       <js:Container id="bigBox" height="32" width="32" 
style="background-color:#E3E3E3;text-align:center;">
           <js:Label text="{no}" 
style="line-height:32px;font-size:150%:font-weight:bold" />
       </js:Container>
</js:Container>

When I run the application I get this exception.

Box.js:88 Uncaught TypeError: Cannot set property 'style' of undefined
   at components.Box.__bindingWrappedSetter__colour (Box.js:88)
   at components.Box.bindable__set__colour (Box.js:124)
   at components.Box.set__colour (Box.js:135)
   at 
Function.org.apache.flex.utils.MXMLDataInterpreter.initializeStrandBasedObject 
(MXMLDataInterpreter.js:158)
   at Function.org.apache.flex.utils.MXMLDataInterpreter.generateMXMLArray 
(MXMLDataInterpreter.js:95)
   at Function.org.apache.flex.utils.MXMLDataInterpreter.generateMXMLInstances 
(MXMLDataInterpreter.js:218)
   at 
org.apache.flex.core.View.org.apache.flex.core.ContainerBase.addedToParent 
(ContainerBase.js:149)
   at Main.org.apache.flex.core.Application.addElement (Application.js:116)
   at Main.org.apache.flex.core.Application.initialize (Application.js:55)
   at Main.org.apache.flex.core.Application.start (Application.js:212)
components.Box.__bindingWrappedSetter__colour @ Box.js:88
components.Box.bindable__set__colour @ Box.js:124
components.Box.set__colour @ Box.js:135
org.apache.flex.utils.MXMLDataInterpreter.initializeStrandBasedObject @ 
MXMLDataInterpreter.js:158
org.apache.flex.utils.MXMLDataInterpreter.generateMXMLArray @ 
MXMLDataInterpreter.js:95
org.apache.flex.utils.MXMLDataInterpreter.generateMXMLInstances @ 
MXMLDataInterpreter.js:218
org.apache.flex.core.ContainerBase.addedToParent @ ContainerBase.js:149
org.apache.flex.core.Application.addElement @ Application.js:116
org.apache.flex.core.Application.initialize @ Application.js:55
org.apache.flex.core.Application.start @ Application.js:212
(anonymous) @ index.html:108

I think that the setter is being called before bigBox exists. Debugging the 
code I can see that this.numElements is 0 inside the colour method.

Thanks,
Justin