Question

我有一个名为list的自定义角度指令。

<my-list data-enabled="true" readonly data-selected-item="value"></my-list>

我有一个工厂，用作Slickgrid的格式化程序/渲染器提供程序。

module.factory('gridCellRenderers', gridCellRenderersFactory);

gridCellRenderersFactory.$inject = ['$log', '$compile', '$rootScope', '$timeout', 'extGridConstants'];

function gridCellRenderersFactory($log, $compile, 
$rootScope, $timeout, extGridConstants) {

var newScope = $rootScope.$new(true, $rootScope);
var _preCompiledComboList = $compile('<my-list data-enabled="true" readonly data-selected-item="value"></my-list>')(newScope);

 var _cellComboListRenderer = function(row, cell, value, columnDef, dataContext){
   _preCompiledComboList[0].getElementsByTagName('input')[0].setAttribute("value", value);
   return _center(_preCompiledComboList[0].outerHTML);

   };
}

目前，该指令已预编译并在我的listrenderer中使用。并且使用我不想要的JS设置指令的 selectedItem 属性。

因此，我在我的_cellComboListRenderer函数中编译了我的指令，如下所示：

var _cellComboListRenderer = function(row, cell, value, columnDef, dataContext){

    var newScope = $rootScope.$new(true, $rootScope);
    var comboListDir = $compile('<my-list data-enabled="true" readonly data-selected-item="' + value +'"></my-list>')(newScope);
    return comboListDir[0].outerHTML;

};

并将 selectedItem 设置为单元格值。但现在问题是，该指令不再编译。它在网格上没有显示任何内容，但是当看到chrome控制台时，我看到：

<my-list data-enabled="true" readonly data-selected-item="cellvalue"></my-list>

现在的问题是：为什么第一个版本正确编译我的指令，而不是第二个版本？

Angularjs：如何正确编译工厂内的自定义指令？

0 个答案: