title: Can't invoke function inside Directive in Angular 1.2
body: <p>I have an isolated scope directive that is called when I click on a button, this directive passes all the scope attrs to a element.bind('click' that opens a fancybox (to show a modal), the problem am having is when fancybox opens and a link is clicked, if I put a onclick event on that anchor, it never fires, it says the function is undefined even though is right there within the directive definition. I don't get it, what is wrong??</p>
  
  <p>Here is an example:</p>
  
  <pre><code>search.directive('popup', [ function () {
   return {
    scope: {
     content: '@',
     expiration: '@',
     instructions: '@'
    },
   restrict: 'A',
   controller: function($scope, $element) {
  
   function hello() {
      alert('hello richie');
    }
  
  var attr = '&lt;a onclick="hello();" href="google.com"&gt;' + $scope.content + '&lt;/a&gt;';
  
  
    $element.bind('click', function() {
      $.fancybox.open({
        modal     : false,
        maxWidth  : 800,
        maxHeight : 600,
        fitToView : false,
        autoSize  : true,
        content: attr,
        closeClick  : false,
        openEffect  : 'none',
        closeEffect : 'none',
        helpers: {
          overlay: {
            locked: false
          }
        },
        tpl : {
         closeBtn : '&lt;button type="button" class="fancybox-item fancybox-close close my-own-close"&gt;×&lt;/button&gt;'
        }   
      });
    });
  </code></pre>