How do I bind to the first item in an ArrayCollection?

Question

My application works with the MVC model. The model contains a Bindable class (BindableItemsClass) which contains an ArrayCollection. I want to bind some stuff in the view to the first item in the ArrayCollection of the Bindable class (hence the property 'firstItem').

The problem is that when the setter 'set firstItem(value:Object)' is used, the view components that are bound to that property aren't updated.

Is there a way to trigger the bindings of the property 'firstItem' manually?

[Bindable]
public class BindableItemsClass extends EventDispatcher
{
    private var _items:ArrayCollection;

    public function get items():ArrayCollection
    {
        return _items;
    }

    public function set items(value:ArrayCollection):void
    {
        _items = value;
    }

    public function get firstItem():Object
    {
        if(_items && items.length>0)
            return items[0];
        else
            return null;
    }

    public function set firstItem(value:Object):void
    {
        if(value)
            items = new ArrayCollection([value]);
        else
            items = new ArrayCollection();
    }
}

Answer 1

dispatch a change event to trigger the binding in the setter:

dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));

That SHOULD work.

if not, then you might also need to annotate your getters:

[Bindable("dataChange")]
public function get firstItem():Object
{
    if(_items && items.length>0)
        return items[0];
    else
        return null;
}

This explicitly defines a binding listener to the function so properties watching this will understand what event to listen for.