Set the dataGridColumn's ItemRenderer dynamically

I have this DataGrid:

<mx:DataGrid id="myDataGrid">
    <mx:columns>
        <mx:DataGridColumn dataField="colA" headerText="Column A:" width="40"
            headerRenderer="path.customComponents.VerticalHeader"
            itemRenderer="path.customComponents.CustomDataGridItemRenderer" />
    </mx:Columns>
</mx:DataGrid>

Only I don't know in advance how many columns there will be. So I tried building the columns with a function in ActionScript:

private var _columns:Array;

[开发者_如何学运维Bindable]
public function set columns(value:Array):void
{
    var c:Array = [];
    for each(var object:Object in value)
    {
        var column:DataGridColumn = new DataGridColumn();
        column.headerText=object.name;
        column.width=40;

        // Setting the Renderers like this doesn't work!
        column.headerRenderer = 
                path.customComponents.VerticalHeader;
        column.itemRenderer = 
                path.customComponents.CustomDataGridItemRenderer;

        c.push(c);
    }
    myDataGrid.columns = c;
}
public function get columns():Array
{
    return _columns;
}

But for some reason, the renders cannot be set like this. (column.itemRenderer = com.ItemRenderer).

What is the proper way to set these renders dynamically?

itemRenderer and headerRenderer expects an mx.core.IFactory as its value. In mxml, the string value that you pass is automatically converted into mx.core.ClassFactory. In ActionScript, you have to do it yourself.

column.itemRenderer 
            = new ClassFactory(path.customComponents.CustomDataGridItemRenderer);