Kaker
Kaker

Reputation: 645

Angularjs: run jquery after load in ng-repeat

Hi How to run jquery scripts when I load data in ng-repeat. jquery works good when I have a static dom element, but when I use ng-repeat scripts not working I need to use dynamically height of div, and bootstrap tooltip. I have this code:

$(document).ready(function () {
    //myMovies
        //$('.templates_movies').height($('.templates').outerHeight());
    $(document).on("load", ".templates_movies", function() {
        $('[data-toggle="tooltip"]').tooltip();
    });


});

But it's not working. Please help me.

Upvotes: 1

Views: 713

Answers (2)

kamlesh
kamlesh

Reputation: 238

you can create directive

app.directive("tooltip",function(){
  return{
    link: function(scope,ele,attr){
      $('[data-toggle="tooltip"]').tooltip(); 
    }
  }
});

and then use "tooltip" with your ng-repeat like

<div ng-repeat ="item in [1,2,3]" tooltip>
   <span data-toggle="tooltip"  class="test" title="Hiiii" ng-bind="item"></span>
</div>

Upvotes: 1

Raulucco
Raulucco

Reputation: 3426

An example of the link function of the directive would be:

function link (scope, element) {
  $(element[0].querySelectorAll('[data-toggle="tooltip"]')).tooltip();
}

Upvotes: 0

Related Questions