jquery - angularjs template(from ng-repeat) and custom directive on same element issue -

i using ng-repeat on element iterate based on array scope. , having custom directive(to create jquery widget) on same element.

now problem custom directive compiled before template ng-repeat evaluated , hence getting raw template string in widget.

html

 <div ng-repeat="o in arr" id="{{o}}" ui-ngrid></div> 

link link function follows.

 module.directive("uingrid", ['$compile', function ($compile) {         return {             restrict: 'cea',             priority: 999,             link: function (scope, element, attrs) {               element.ngrid(processatrr(attrs));             }       }     }); 

controller

$scope.arr = ["0","1"]; 

now inside code, getting id values {{o}} instead of evaluated value.

what reason behind , how can resolve issue?

you can use ng-attr-id='{{o}}' values come after template compilation.