How to use angularjs directive to append HTML content to thead in table?

Question

I want to append <tr><button></button></tr> to the <thead>in the below html.

  <table>
    <thead>
    <tr>
    Header 1
    </tr>
    </thead>

  </table>

Is it possible to achieve the idea above using angular directives?

Panos K · Accepted Answer · 2017-09-07 13:11:42Z

1

in your linking function of your costum directive you can use

angular.element(document).find("thead").append("<tr><button></button></tr>")

your directive could look like this:

angular.module('app', [])
.directive('myDirective', ['$document', function($document) {
  return {
    link: function(scope, element, attr) {
      angular.element(document).find("thead").append("<tr><button></button></tr>")
    }
  };
}]);

carefull i havent tested this code but this is the way to manipulate DOM in custom directives ,i will make a plunker when i can

answered Sep 7, 2017 at 13:11

Panos K

1,0911 gold badge13 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Panos K Over a year ago

you need to post your full code to help you further or even better make a plunker with it

Collectives™ on Stack Overflow

How to use angularjs directive to append HTML content to thead in table?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related