angularJS-可变组件模板
是否可以在angularJS 1.6中为组件定义变量模板? 大概是这样的:angularJS-可变组件模板,angularjs,Angularjs,是否可以在angularJS 1.6中为组件定义变量模板? 大概是这样的: <div class="test"> <{{$ctrl.GetElement()}}> </div> 对于我想在运行时决定模板是什么样的情况 有办法吗?这里是一个使用$compile的“变量模板”的简单示例。让我们定义一个能够生成其他指令的“生成器”指令: app.directive('createDirective', function($compil
<div class="test">
<{{$ctrl.GetElement()}}>
</div>
对于我想在运行时决定模板是什么样的情况
有办法吗?这里是一个使用
$compile
的“变量模板”的简单示例。让我们定义一个能够生成其他指令的“生成器”指令:
app.directive('createDirective', function($compile) {
return {
scope: {
directiveName: '@'
},
link: function(scope, element) {
var newHtml = '<' + scope.directiveName +'></ '+ scope.directiveName +'>';
element.append($compile(newHtml)(scope));
}
};
});
现在,我们可以使用generator指令编译“Hello”指令
<div create-directive directive-name="hello"></div>
在HTML中:
<div create-directive directive-name="{{newDirective}}"></div>
一定要看一看
您可能正在寻找
$compile
这是可能的,但完全违背了angular的设计目标。这是指令和组件的领域;这种包含在表达式内部执行的函数的代码将使应用程序的性能更加出色。
<hello class="ng-scope">
<!-- hello-->
Hello!
</hello>
app.controller('MainCtrl', function($scope) {
$scope.newDirective = "from-controller";
});
<div create-directive directive-name="{{newDirective}}"></div>