how could i get event fire when ng-click

Question

i m adding an anchor tag with ng-click with the ng-bind-html template but the ng-click is not triggering... i need a solution triggering the function.

my template:

$scope.res =$scope.res+'<a href="javascript:void(o)" ng-click="fullfillmentCenter('+row.orderId+')"  title="Send to fullfilment" class="">Send to CA Fullfilment</a>';

my bind html:

<div class="ngCellText" id="div_fullfilment_{{row.getProperty(\'orderId\')}}" ng-bind-html="fullfillment(row.entity)"></div>';

ng-function call:

$scope.fullfillmentCenter = function(orderId){
alert(orderId);
};

Answer 1

You need to compile your html using $compile service for any AngularJS bindings to work. Since $compile requires the html element to compile, it would be preferable if you to create a directive. See this SO post Compiling dynamic HTML strings from database

The other alterative that can work if the template is fixed would be to use ng-include and include you template. With ng-include compile happens automatically.

You can define template as

<script type='text\ng-template' id='content'>
   <a href="javascript:void(o)" ng-click="fullfillmentCenter(row.orderId)"  title="Send to fullfilment" class="">Send to CA Fullfilment</a>
</script>

Then include it using ng-include anywhere <div ng-include="content">