Nested ListBase/itemRenderer?

Question

I'm quite experienced in XAML/WPF but am new to Flex/Flex4. I'm trying to build a list of animatable objects with a sub-list of their animations using ListBase and inline ItemRenderers. Can someone shed any light on why the inner ListBase gives me the following error, while the outer list doesn't?

'spark.components.supportClasses.ItemRenderer' is not assignable to the default property, 'dataProvider', of type 'mx.collections.IList'.

The source code:

<s:ListBase dataProvider="{AnimationList}">
    <s:itemRenderer>
        <fx:Component>
            <s:ItemRenderer>
                <s:VGroup>
                    <s:Label id="labelDisplay"  text="{data.Name}"/>

                    <s:ListBase dataProvider="{data.Animations}">
                        <s:ItemRenderer>
                            <fx:Component>
                                <s:ItemRenderer>
                                    <s:HGroup>
                                        <mx:Button label="play" />
                                        <mx:Label text="{data.Name}"/>
                                    </s:HGroup>
                                </s:ItemRenderer>
                            </fx:Component>
                        </s:ItemRenderer>
                    </s:ListBase>

                </s:VGroup>
            </s:ItemRenderer>

        </fx:Component>
    </s:itemRenderer>
</s:ListBase>

Answer 1

You're using <s:ItemRenderer> (so it is an instance of ItemRenderer class assigned to ListBase's default property which is dataProvider). I suppose it is typo and you're going to use property <s:itemRenderer> as in outer list. Take a look at first letter's case. In ActionScript all the classes starts with capitals.