Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save dayvsonlima/a605d069b4b98fcd40e7 to your computer and use it in GitHub Desktop.
Save dayvsonlima/a605d069b4b98fcd40e7 to your computer and use it in GitHub Desktop.
diretivas recursivas em angular - nested directives
var myModule = angular.module('myModule', []);
myModule.directive('foo', function(RecursionHelper){
return {
restrict: "EAC",
replace: true,
template: '<strong>ok<div bar></div></strong>',
compile: function(element) {
// Use the compile function from the RecursionHelper,
// And return the linking function(s) which it returns
return RecursionHelper.compile(element);
}
}
});
myModule.directive('bar', function(){
return {
restrict: "EAC",
replace: true,
template: '<i>bar</i>'
}
});
myModule.factory('RecursionHelper', ['$compile', function($compile){
return {
/**
* Manually compiles the element, fixing the recursion loop.
* @param element
* @param [link] A post-link function, or an object with function(s) registered via pre and post properties.
* @returns An object containing the linking functions.
*/
compile: function(element, link){
// Normalize the link parameter
if(angular.isFunction(link)){
link = { post: link };
}
// Break the recursion loop by removing the contents
var contents = element.contents().remove();
var compiledContents;
return {
pre: (link && link.pre) ? link.pre : null,
/**
* Compiles and re-adds the contents
*/
post: function(scope, element){
// Compile the contents
if(!compiledContents){
compiledContents = $compile(contents);
}
// Re-add the compiled contents to the element
compiledContents(scope, function(clone){
element.append(clone);
});
// Call the post-linking function, if any
if(link && link.post){
link.post.apply(null, arguments);
}
}
};
}
};
}]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment