AngularJS动态模板未评估

Question

I am dynamically generating a table template in a directive, in the compile attribute :

compile : function (tElem, tAttrs, test) {
$http.get(tAttrs["source"]+"/0/1/true").success(
    function(result) {

        // adding angular expressions for adding data in table
        var tr = '<tr ng-repeat="item in data track by $index" >';
        for (var name in result[0]) {
            console.log(name);
            tr += '<td>{{ item.'+name+' }}</td>';
        }
        tElem.find("tbody").append(tr+'</tr>');

});
return function(){ ... }
}

But the expressions are not evaluated and I only get

{{ item.id }}   {{ item.currMtmDate }}  {{ item.prevMtmDate }}  {{ item.user }} {{ item.description }}

displayed on my page.

If I do

var v = 'currMtmDate';
var b = '<tr ng-repeat="item in data track by $index"><td>{{ item.'+v+' }}</td></tr>';
tElem.find("tbody").append(b);

then it works well.

I have no idea why it works in 2nd example and not in the 1st.

Answer 1

这样做的一种好方法是使用ng-include标记创建一个div并更新该标记： div ng-iclude="templateUrl"></div>然后在$ http末尾更新变量'templateUrl' 。得到