![](/img/trans.png)
[英]Angular Material - $mdDialog custom template - ng-click for function in directive?
[英]Change a directive template using ng-click
我在控制器中有几个用ng-click
按钮,并且我想在单击按钮时更改指令模板。 实现此目标的最佳方法是什么? (我稍后将在元素上使用幻灯片)
指示:
myModule.directive('foo', function() {
return {
scope: {
templateType: '@'
},
template: '<div ng-if="templateType == \'a\'">' +
' this is template A ' +
'</div>' +
'<div ng-if="templateType == \'b\'">' +
' this is template B ' +
'</div>'
};
});
模板:
<foo template-type="{{ templateType }}"></foo>
<a ng-click="templateType = 'b'" href="">Set template to b</a>
控制器:
$scope.templateType = 'a';
您可以扩展@JB Nizet提供的示例,并使用ng-include
交换模板,并且管理较大尺寸的模板变得更加容易。
myModule.directive('foo', function() {
return {
scope: {
templateType: '@'
},
template: '<div ng-include="\'/templateRoot/\' + templateType">'+
'</div>'
};
});
现在,您可以创建单独的模板文件,并使它们在特定的url上可用(在本例中为/templateroot/a
或/templateroot/b
)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.