how to add dynamically ng-click in datatable using angularjs?

Question

I am trying to add dynamically an anchor tag link in datatable, tag is added but ng-click event not working.

my angularjs code:

listApp.controller('mylistctr', ['$scope', '$timeout', '$compile', function ($scope, $timeout, $compile) {
 $timeout(function () {
    if (!$.fn.dataTable) return;

    dtInstance1 = $('#datatable1').dataTable({
        'paging': true,  // Table pagination
        'ordering': true,  // Column ordering 
        'info': true,  // Bottom left status text
        sAjaxSource: '/AutomationFX/api/clusters/phones/phonelist',
        aoColumns: [
          { mData: 'column1' },
          { mData: 'column2' },
          { mData: 'column3' },
          { mData: 'column4' },
          { mData: 'column5' }
        ], "aoColumnDefs": [{
            "aTargets": [4],
            "mRender": function (data, type, full) {
                return '<a ng-click="openWindow('+data+')"><img src="app/img/a.png"/></a>';

            }
        }]
    });

});
});

My html

<div class="table-responsive">
                <table id="datatable1" class="table table-striped">
                    <thead>
                        <tr></tr>
                    <th style="width:15%">Name</th>
                    <th style="width:15%">LastName</th>
                    <th style="width:15%">Contact</th>
                    <th style="width:45%">Desc</th>
                    <th style="width:10%">Action</th>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>

so far I have found that I have to compile dynamic html, but i have not found right solution yet.

You can use $compile service wrapping it into a directive, see this http://stackoverflow.com/questions/15279244/dynamically-add-directives-on-angularjs — Alejandro Garcia Anglada, Aug 26 '15 at 05:44
not duplicate, i have already checked that i am looking to compile element in datatable inside — Amit Arya, Aug 26 '15 at 05:59
@AmitArya you must have missed something while doing compiling element — Pankaj Parkar, Aug 26 '15 at 06:22
@AmitArya Try `return $compile('a>...')($scope)[0].innerHTML;` — Rohan Kumar, Aug 26 '15 at 07:03
i think by this way i will get only not full anchor tag with ng-click event — Amit Arya, Aug 26 '15 at 07:18

how to add dynamically ng-click in datatable using angularjs?

0 Answers0