Data binding will not be able to detect assignments to "RelatedOrderLines"

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" backgroundAlpha="0.0">
    <mx:Metadata>
       [Event(name="logout")] 
    </mx:Metadata>
 
<mx:Script>
    <![CDATA[
        import mx.controls.PopUpButton;
        import UI.Administrate.AdministerCatalog;
        import mx.managers.PopUpManager;
        import com.FoodAndDrinks.OrderLine;
        import weborb.data.DynamicLoadEvent;
        import mx.events.CollectionEvent;
        import com.FoodAndDrinks.Order;
        import com.FoodAndDrinks.Product;
        import com.FoodAndDrinks.ActiveRecords;
        import mx.collections.ArrayCollection;
        import com.FoodAndDrinks.Account;
        
        [Bindable]
        private var _account:Account;
        
        [Bindable]
        private var _products:ArrayCollection;
        
        [Bindable]
        private var _order:Order;
        
                
        // Main application (FoodAndDrinks.mxml) invokes the method below to initialize the 
        // catalog and open/create order associated with the logged in account.
        public function init(account:Account):void
        {
            _account = account;
            
            // Load all products using paging. The method synchronously returns a managed collection.
            // The collection initially is empty since the data loading is handled asynchronously.
            // As soon as the data arrives from the server, WDMF initializes the collection. 
            // The collection is bindable, as a result, all the data is shown in the UI as soon as
            // the collection is initialized.
            _products = ActiveRecords.Product.findAll({PageSize:10});
            
            // Check if there is an order for the given account. If no order can be found, WDMF creates a new
            // order record and returns the corresponding Order object.
            // The method used below - findOrCreateByAccountIdAndStatus - is a dynamic method, composed of the 
            // following parts: findOrCreateBy + AccountId + And + Status, where AccountId and Status are the 
            // properties of the Order class. The method first checks if a record with the given properties
            // exists in the Order table. If not, WDMF creates one. The record then is returned to the client
            // as an instance of the Order class.
            var order:ArrayCollection;
            order = ActiveRecords.Order.findOrCreateByAccountIdAndStatus(account.AccountId,"new");
            
            // Add a listener for the event fired when the Order object for the current account is loaded
            order.addEventListener("loaded",
                function(event:DynamicLoadEvent):void
                {
                    // store the order object in memory. This application works with the given order object
                    _order = order[0] as Order;
                });
        }
        
        public function addToCart(product:Product):void
        {
            var resultList:ArrayCollection;
            
            // Check if the item added to the shopping cart already exists in the order.
            // The method used below - findOrCreateByOrderIdAndProductId - is a dynamic method, composed of the 
            // following parts: findOrCreateBy + OrderId + And + ProductId, where OrderId and ProductId are the 
            // properties of the OrderLine class. The method first checks if a record with the given properties
            // exists in the OrderLine table. If not, WDMF creates one. The record then is returned to the client
            // as an instance of the OrderLine class.            
            resultList = ActiveRecords.OrderLine.findOrCreateByOrderIdAndProductId( _order.OrderId, product.ProductId );
            
            // Add a listener to be called when the record is received from the server.
            resultList.addEventListener("loaded",
                function(event:DynamicLoadEvent):void
                {
                    // There&apos;s only one record, so cast it to the OrderLine class
                    var orderLine:OrderLine = resultList[0] as OrderLine;
                    
                    // If the user clicks "Add to cart" several times in a row, the object will be locked
                    // while the record is updated. The IsLocked flag indicates that an update is in progress.
                    if(orderLine.IsLocked)
                        return;
                    
                    // Update the quantity which represents how many items of the given product are in the cart
                    orderLine.Quanity++;
                    
                    // Save the order line. The call below triggers an update in the database
                    orderLine.save();
                });
        }
        
        private function openAdmin():void
        {
            var adminWindow:AdministerCatalog = new AdministerCatalog();
            PopUpManager.addPopUp( adminWindow, this, true );
            PopUpManager.centerPopUp( adminWindow );
        }
    ]]>
</mx:Script>
    <mx:HBox top="46" right="10" bottom="10" left="10" cornerRadius="10">
        <mx:VBox height="100%" width="210">
            <mx:Panel title="Shopping Cart" height="100%" width="100%" styleName="shopViewPanel" >
            <mx:TileList width="100%" height="100%" dataProvider="{_order.RelatedOrderLines}">
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:Canvas horizontalScrollPolicy="off">
                            <mx:VBox top="5" left="5" right="5"    bottom="5"
                                borderStyle="solid" backgroundColor="#ffffff">
                                <mx:Label text="{data.RelatedProduct.Name}" fontWeight="bold" paddingLeft="10"/>
                                <mx:HBox>
                                    <mx:Image scaleContent="true" horizontalAlign="center"  width="80" height="50" source="images/{data.RelatedProduct.PictureFileName}"  autoLoad="true"  />
                                    <mx:VBox>
                                        <mx:Label text="Price: ${data.RelatedProduct.Price}" />    
                                        <mx:Label text="Quantity: {data.Quanity}" />
                                    </mx:VBox>
                                </mx:HBox>
                                <mx:HBox width="100%" paddingRight="10" paddingBottom="5">
                                    <mx:Spacer width="100%" />
                                    <mx:Button label="remove"  height="15" click="data.remove()" />
                                </mx:HBox>
                            </mx:VBox>    
                        </mx:Canvas>
                    </mx:Component>
                </mx:itemRenderer>
            </mx:TileList>
            </mx:Panel>
        </mx:VBox>
        <mx:VBox height="100%" width="100%">
            <mx:Panel width="100%" height="100%" layout="absolute" title="Product Catalog" styleName="shopViewPanel">
                <mx:TileList width="100%" height="100%" dataProvider="{_products}" borderStyle="none" y="0">
                    <mx:itemRenderer>
                        <mx:Component>
                            <mx:Canvas horizontalScrollPolicy="off" verticalScrollPolicy="off">
                            <mx:Script>
                                <![CDATA[
                                    import com.FoodAndDrinks.Product;
                                    
                                    private function onAdd():void
                                    {
                                        ShopView(parentDocument).addToCart(Product(data));
                                    }
                                ]]>
                            </mx:Script>
                            <mx:VBox
                                top="5"
                                left="5"
                                right="5"
                                bottom="5"
                                borderStyle="solid" backgroundColor="#ffffff"> 
                                <mx:Label text="{data.Name}" textAlign="center" width="100%" fontWeight="bold" />
                                <mx:Image horizontalAlign="center"  width="190" height="127" source="images/{data.PictureFileName}"  autoLoad="true"  />
                                <mx:HBox width="100%" paddingRight="10" >
                                    <mx:Label paddingLeft="10" text="Price: ${data.Price}"  />
                                    <mx:Spacer width="100%" />
                                    <mx:Button label="add to cart"  height="15" click="onAdd()" />
                                </mx:HBox>
                            </mx:VBox>    
                            </mx:Canvas>
                        </mx:Component>
                    </mx:itemRenderer>
                </mx:TileList>
            </mx:Panel>
        </mx:VBox>
    </mx:HBox>
    <mx:ApplicationControlBar right="10" left="10">
        <mx:Label text="Welcome  {_account.Login}" color="#ffffff"/>
        <mx:VRule height="12" strokeColor="#ffffff"/>
        <mx:LinkButton label="Manage Catalog" color="#ffff00" click="openAdmin()"/>
        <mx:Spacer width="100%"/>
        <mx:LinkButton label="Logout" color="#ffff00" click="{dispatchEvent( new Event(&apos;logout&apos;))}"/>
    </mx:ApplicationControlBar>
    
</mx:Canvas>