所以,这是我的问题。我有两个指令(比如父指令和子指令),我从父指令调用child指令,如下所示:
angular.module('components', [])
.directive('helloWorld', function() {
return {
restrict: 'E',
compile: function(element, attrs) {
var x = '<directive2></directive2>';
element.append(x);
}
}
})
.directive("directive2", function($compile, $parse) {
return {
restrict: 'E',
compile: function(iElement, iAttrs, transclude) {
iElement.append('<p>directive2</p>');
}
}
});
angular.module('HelloApp', ['components'])
这很好用。但是现在我在编译的post函数中写了一个条件,当条件满足时,child指令应该追加。
我刚刚在post函数中添加了append函数,但它无效。
angular.module('components', [])
.directive('helloWorld', function() {
return {
restrict: 'E',
compile: function(element, attrs) {
return {
post: function(scope, element, attrs) {
var x = '<directive2></directive2>';
element.append(x);
}
}
}
}
})
.directive("directive2", function($compile, $parse) {
return {
restrict: 'E',
compile: function(iElement, iAttrs, transclude) {
iElement.append('<p>directive2</p>');
}
}
});
angular.module('HelloApp', ['components'])
我不知道出了什么问题。引导我的朋友
答案 0 :(得分:1)
尝试将模板定义为第一个指令:
angular.module('components', [])
.directive('helloWorld', function() {
return {
restrict: 'E',
template: '<directive2></directive2>'
}
}
})
答案 1 :(得分:1)
您需要先使用$compile
服务,然后按以下方式添加:
angular.module('components', [])
.directive('helloWorld', function($compile){
return {
restrict: 'E',
link: function(scope, element, attrs) {
var x = angular.element('<directive2></directive2>');
element.append($compile(x)(scope));
}
}
})
.directive("directive2", function() {
return {
restrict: 'E',
compile: function(element, attrs, transclude) {
element.append('<p>directive2</p>');
}
}
});
angular.module('HelloApp', ['components']);