html字符串

Question

我正在尝试使以下代码正常工作：

var td = $(elem).treegrid('getPanel').find('div.datagrid-header td[field="itemtype"]');
        td[0].innerHTML = td[0].innerHTML + 
            '<table style="width:100%;margin-top:-8px;margin-left:2px"><tr>' +
            '<td style="width:18px;text-align:center">' +
                '<a href="" ng-click="getFilteredAssets(filterItemType)">' +
                    '<img border="0" src="all_filter.png">' +
                '</a>' +
            '</td>' + 
            '</td>' +
            '<td style="width:18px">' +
                '<img src="assets_filter.png"/>' +
            '</td>' +
            '<td style="width:18px">' +
                '<img src="projects_filter.gif"/>' + 
            '</td></tr></table>';

我正在将图像放到这个地方，但点击指定了ng-click的图像并没有做任何事情。知道如何让它发挥作用吗？

由于

修改后的代码

var element = $compile(angular.element
            ('<table style="width:100%;margin-top:-8px;margin-left:2px"><tr>' +
            '<td style="width:18px;text-align:center">' +
                '<a href="" ng-click="getFilteredAssets(filterItemType)">' +
                    '<img border="0" src="all_filter.png">' +
                '</a>' +
            '</td>' +
            '</td>' +
            '<td style="width:18px">' +
                '<img src="assets_filter.png"/>' +
            '</td>' +
            '<td style="width:18px">' +
                '<img src="projects_filter.gif"/>' +
            '</td></tr></table>')
            )(scope);
        td[0].innerHTML = td[0].innerHTML + element;

Answer 1

Angular无法知道你已经为你的DOM添加了一些HTML。您应该使用编译服务。它将扫描HTML搜索ng- *指令等，并将其应用于当前范围。

var element = $compile(angular.element('your html with ng-* directives''))(scope);

然后您可以将该元素插入DOM。