Callback method ng-repeat

http://babasharepoint.blogspot.com/2015/12/how-to-know-when-your-angular-rendering.html

by Muhammad Irfan Khan

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.10/js/jquery.dataTables.js"></script>
<div ng-app="app">
<div ng-controller="ctrl">
<table id="tbl">
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>           
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="row in Data" render-end="OnRenderEnd()">
            <td>{{row.ID}}</td>
            <td>{{row.Name}}</td>            
        </tr>
    </tbody>
</table>
    
</div>
</div>

JavaScript

var app = angular.module('app', []);
        
        app.controller("ctrl", function($timeout){
        		var vm = this;
            vm.Data = [{ID:1, Name:"Irfan"},{ID:2, Name:"Imran"}];
            
            vm.OnRenderEnd = function(){
                $timeout(function(){
                    $('#tbl').DataTable();
                }, 1);
            };
            
        });
        
        app.directive("renderEnd", function(){
            return {
                restrict: "A",
                link: function (scope, element, attrs) {
                    if (scope.$last) {
                        scope.$eval(attrs.renderEnd);
                    }
                }
            };
        });