Ng-repeat Finish Event Not Working After Sorting

I'm using JQuery date-picker with angularJS. I'm setting date-picker in ng-repeat finish event. but if sorted order got changed then i need to re-initialize the date picker but ng-

Solution 1:

What you are trying to do is not valid.

The directive onFinishRender fires when it is bind to the element and not when it is really finish sorting.

But that is not why its not working. Its not working because you are using $emit and not $broadcast .

Take a look at this link to understand the differences more clearly.

Replay comment: may be try to sort the array before you pass it to the dom

angular.module('app').controller('myController',function($filter){
   var arr = [] // huge array$scope.sort = function(sortType){
     scope.data = $filter('orderBy')(arr , sortType, true);
   }
   $scope.sort('default');

})

Now, as i see in you fiddle code, you can use the ng-click on the header to call a sort function as an angular expression

Solution 2:

A little bit on the side that pattern won't do worse than your directive

myapp.run(['$scope','$timeout', function($scope,$timeout) {
  $timeout(function () {
    $scope.$broadcast("domIsReady");
  });
}]);

Try it yourself and I would like to hear your feedback

Solution 3:

I used AngularJS directive this issue is solved. Date picker TD is below:

 <td align="center" style ="width: 229px;"><input type="text" class="datepicker" ng-change="dateChange($index, row)" datepicker ng-model="row.startDate"readonly="readonly" style="cursor: default"></td>

Directive Code:

.directive("datepicker", function () {
    return {
        restrict: "A",
        link: function (scope, el, attr) {
            el.datepicker({
              dateFormat: 'dd/mm/yy'
            });
        }
    };
})