title: ng-click not working after compile ng-bind-html
body: <p>I have a directive </p>
  
  <pre><code>app.directive("dir", function($compile, $sce){
        return{
          restrict: "E",
          link: function(scope, element, attr){
            scope.$watch('content',function(){
              var html = $sce.trustAsHtml(attr.content);
              scope.alabala = $compile(html)(scope);
            },true);
          },
          template: "&lt;div ng-bind-html='alabala'&gt;&lt;/div&gt;",
        }
      });
  </code></pre>
  
  <p>a controller:</p>
  
  <pre><code>function MainController($scope, $http, customService, $location, $sce, $compile){
      $scope.init = function(){
          customService.get().success(function(data) {
                   var html = $sce.trustAsHtml(data);
                  $("#dir").attr("content", data);
  
              });
      };
  }
  </code></pre>
  
  <p>and on my index page I have:</p>
  
  <pre><code>&lt;div id="div" ng-controller="MainController" class="pull-right span3" ng-init="init()"&gt;
        &lt;dir id="dir" &gt;&lt;/dir&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>my custom service returns every time a different html containing for example</p>
  
  <pre><code>&lt;button ng-click='click()'&gt;Click me&lt;/button&gt;
  </code></pre>
  
  <p>What I am trying to do is every time when I push a different value in the content of my directive to compile it and put it in my html and handle the click function from my controller. Because I'm new to AngularJS I have been struggling with this problem for sometime. Please help.</p>