javascript - AngularJS - compiled html in tootilp -

i trying use tooltip in ng-repeat based on angularjs: grab compiled html , set tooltip

however somehow not able make work. html-

 <tr ng-repeat="row in docdetails"> <td class="usebootstrap uploadeddocs"> <div class="usebootstrap col-sm-2" upload-info="row" index="{{$index}}"> <p tooltip-html-unsafe="{{tooltips[$index]  }}"> {{ row.filename | limitto: 15 }}{{row.filename.length > 15 ? '...' : ''}}</p> 

my directive

app.directive('uploadinfo', function ($compile, $timeout) { /* wrap in root element can final innerhtml*/ var tiptemplate = '<div> {{row.filename}} injected in tooltip </p><div>';  return {     link: function (scope, el, attrs) {         var tipcomp = $compile(tiptemplate)(scope)         $timeout(function () {             scope.tooltips[attrs.index] = tipcomp.html()          });     } } 

});

controller have declared

$scope.tooltips = []; 

can tell me if missing anything?