自定义组件未加载到 ig-grid 列模板中

Custom component not loading in ig-grid column template

我正在尝试在 ig-grid 列模板中使用定制组件。组件在 Html 中正确呈现,但它永远不会到达组件的构造函数。如何在列模板中使用自定义组件?

<script id="colTmpl" type="text/template">
    <custom-component data="${datatouse}"></custom-component>
</script>

<div>
    <ig-grid id="grid1" data-source="vm.datasource" width="100%" primary-key="Id" auto-generate-columns="false" autocommit="true">
        <columns>
            <column key="Id" header-text="Id" width="50px" data-type="number" hidden="hidden"></column>
            <column key="datatouse" width="100%" header-text="my custom component" datatype="object" template="{{getHtml('#colTmpl')}}"></column>
        </columns>
    </ig-grid>
</div>

您可以覆盖 Ignite UI 模板 ($.ig.tmpl) 并将自定义组件应用于单元格。

$.ig.tmpl = function (tmpl, data) {
    angCells.push($compile(tmpl)($scope));
    return "";
}

这是一个fiddle