通过AngularJS获取动态html内容后删除了ng-click属性

Question

我在谷歌搜索过。从stackoverflow获得了一些相关链接。我在我的代码中实现了该脚本所有代码都不能正常工作。基本上我是按照这个链接ng-click not working in dynamically created content那个工作正常而没有点击我的Click Here链接。我的意思是自动触发invite()功能。请检查我的代码 -

function test($scope){
   $scope.email_output = 'Email already exist. <strong><a href="" ng-click="invite();">Click Here</a></strong> to Invite';
   $scope.invite = function(){
       alert("Hello world");
   };
}


angular.module('myApp').controller('test', test);

HTML

<div ng-controller="test">
   <div ng-if="email_output" ng-bind-html="email_output"></div>
</div>

我获得了动态HTML内容。但我看到我的HTML内容中没有ng-click。看我的输出：

<div ng-bind-html="email_output" ng-if="email_output" class="ng-binding ng-scope">Email already exist. <strong><a href="">Click Here</a></strong> to Invite</div>

请帮助我，我是AngularJS的新手。如何在动态HTML内容中获取ng-click attribut？

修改： -

请在此处查看我的更改代码 -

var email_result_html = 'Email already exist. <strong><a href="" ng-click="invite();">Click Here</a></strong> to Invite';
var temp = $compile(email_result_html)($scope);
angular.element(document.getElementById('email_result')).append(temp);


<div ng-if="email_result" id="email_result" ng-bind-html="email_result"></div>

错误输出：