title: ng-click in template not firing
body: <p>I am having no luck figuring out why the ng-click isn't calling the function.  I am compiling the angular template.  I know I have an isolated scope, but the function That should be called is on the scope of the directive...</p>
  
  <p><a href="http://jsfiddle.net/k66Za/101/" rel="nofollow">JSFiddle</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;html ng-app="myMod"&gt;
      &lt;head&gt;
      &lt;/head&gt;
      &lt;body ng-controller="myController"&gt;
          &lt;table&gt;
              &lt;thead&gt;&lt;th&gt;&lt;/th&gt;&lt;th&gt;Name&lt;/th&gt;&lt;/thead&gt;
              &lt;tbody&gt;
                  &lt;tr ng-repeat="datum in data" my-element person ="datum"&gt;&lt;/tr&gt;
              &lt;/tbody&gt;
          &lt;/table&gt;
      &lt;script src="angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="test.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>AngularJS(v1.28):</p>
  
  <pre><code>angular.module("myMod", []).
      controller("myController",
      function ($scope) {
  
          $scope.data = [
              { 'name' : 'testA', 'isAdmin': true},
              { 'name' : 'testB', 'isAdmin': false},
              { 'name' : 'testC', 'isAdmin': false},
          ];
  }).directive("myElement",function($compile){
  
      var myTest = function(){
          console.log("table cell clicked!");
      };
  
      var getTemplate = function(person){
          return '&lt;td&gt;&lt;span ng-click="myTest()"&gt;{{person.name}}&lt;/span&gt;&lt;/td&gt;&lt;td&gt;test2&lt;/td&gt;';
      };
  
  return {
          restrict : 'A',
          scope : {
              person : "="
          },
          link : function (scope,element,attrs){
  
              var template = getTemplate(scope.person);
              element.html(template);
              $compile(element.contents())(scope);
          } 
      };
  </code></pre>
  
  <p>});</p>