0

I searched in google. Got some related links from stackoverflow. I implemented that script in my code all that code not working fine. Basically I followed this link ng-click not working in dynamically created content That one is working fine without clicking my Click Here link. I mean automatic fired to invite() function. Pleas check below my code - 

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>

I got my dynamic HTML content. But I saw ng-click not present in my HTML content. See my output :

<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>

Please help me I am new in AngularJS. How to get my ng-click attribut in dynamic html content?

Edit:-

See here my change code - 

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>

Error Output:

enter image description here

Community
  • 1
  • 1
Chinmay235
  • 3,236
  • 8
  • 62
  • 93
  • 1
    angular attributes should be compiled, use this - http://stackoverflow.com/a/30468981/5954939 – AranS Aug 09 '16 at 10:58
  • @AranS I saw that answer. Tested. But I want my `invite()` function should work while click on `ng-click="invite()"` I have used this code `var div = angular.element("email_output"); div.bind('click', $scope.invite());` this code working fine. But this is automatically fired without clicking `ng-click` anchor link. – Chinmay235 Aug 09 '16 at 11:09
  • 1
    this isn't the way to think about angular. You really should do everything in your power to avoid storing HTML fragments in variables when using angular. if you have **no other choice**, then the only way to handle this is to use `$compile`, like the link @AranS provided, but this is a slippery slope that should be avoided. – Claies Aug 09 '16 at 12:23

0 Answers0