2015-09-27 154 views
1

我想在另一个指令tempalte中添加动态指令。 正如你看到的我想添加其他指令一条指令模板 里面如何添加这些动态指令有在AngularJS的另一个指令模板中添加一个动态指令

请帮

return { 
restrict: 'AE', 
require :'^awkGrid', 
templateUrl: 'views/shutter.html', 
link : function(scope, element, attr, controllerInstance){ 

    //Set the header 
    scope.items = []; 
    angular.forEach(scope.rowData, function(value, key) { 

     var obj = { 
      key : key, 
      value : value 
     }; 


     template = <country name="'+value.country+'" id="'+key+'"></country>; 
     scope.items.push(template); 
    }); 
}; 
//Inside shutter.html file 
<div data-ng-repeat="item in items" class="ag-row action-row" 
ng-class-odd="'ag-row-even'" 
ng-class-even="'ag-row-odd'" 
ng-class="{'ag-row-selected':$index == selectedRow}" 
ng-click="setClickedRow($index,$event)"> 
<div class="ag-cell"> 
      {{item}} //Not working ,Prinitng the string 
    <country name="india" id="-1"></country> //Working 
</div> 

回答

0

你必须重新编译指令。在链接功能的末尾添加以下代码:

$compile(element.contents())(scope); 

答案在here

当然,您必须将servis $compile作为依赖添加到您的指令中。

+0

无法正常工作仍在显示 as string –

+1

你可以把你的解决方案放到jsfiddle.net上吗? – Niezborala

+0

恐怕是不可能的 –

0

要动态地切换指令的整个模板,必须将元素的html设置为所需的新模板,然后将元素的内容传递到$compile以将其与$scope绑定。

element.html('<h1>Dynamic Content</h1>').show();

$compile(element.contents())($scope);

这都应该在有关指令的link功能来定义。

相关问题