How to have a directive template keep element content?

Question

I'm trying to add ng-click to a button. My HTML:

<button class="btn">clicky</button>

And the directive:

angular.module('app').directive('btn', function() {
  return {
    restrict: 'C',
    replace: true,
    scope: true,
    transclude: true,
    template: '<button ng-click="onClick()"></button>'
  };
});

It removes clicky from the element.

Transclude doesn't help. Thanks for any answers.

Answer 1

Add ng-transclude in template.

template: '<button ng-click="onClick()" ng-transclude></button>'