CODEWITHSUNDEEP
angularjsangularjs-directive
Peter Wilson
Peter Wilson

Reputation: 4319

Angular Js reuse directives

I am wondering if I can make an Angular Js directive then I can use it again on the run time

here is a simple example 

app.directive('w34Directive',function(){
return{
    template : "<p>test</p>"
  }
})

and here is the HTML

<div w34-directive></div>

but if I have a button with ng-click function that do the following function in the controller

var elem = document.querySelector('.myContainer');
angular.element(elem).append("<div w34-directive></div>");

which mean that a new DOM uses the directive will be generated but actually the angular directives fire once on the page load so when I add the new DOM it just add an empty div tag without the template of the directive which is in this case :

<p>test</p>

any idea about how to overcome this ?

Upvotes: 0

Views: 530

Answers (1)

Nicolas2bert
Nicolas2bert

Reputation: 1152

Yes, you can do it using :

$compile

Exemple :

 var el = $compile( "<div w34-directive></div>" )( $scope );
 angular.element(elem).append( el );

Upvotes: 1

Related Questions