AngularJS - Call jquery after load

Question

I have an image slider on my page:
That is my call:

<div id="slider">
    <ul class="bjqs">
        <li ng-repeat="image in dealer.images"><img src="{{image}}" alt="{{image}}" /></li>   
    </ul>
</div>

Somehow the slider doesn't work. I think I have to load the jQuery init after the images are loaded.
This is the call for the slider:

$('#slider').bjqs({
            height      : 420,
            width       : 130,
            responsive  : true
          });

How can I call this function after the images are loaded?

Maybe ngSrc or this post can help?

Gloopy
– Gloopy

2013-01-07 04:03:38 +00:00
Commented Jan 7, 2013 at 4:03 — Gloopy
– Gloopy, Commented Jan 7, 2013 at 4:03

Community · Accepted Answer · 2017-05-23 11:48:59Z

1

If you are sure that's the problem than you can use Nick Craver's solution

$(".bjqs img").one('load', function() {
   $('#slider').bjqs({
       height      : 420,
       width       : 130,
       responsive  : true
   });  
}).each(function() {
   if(this.complete) $(this).load();
});

edited May 23, 2017 at 11:48

CommunityBot

11 silver badge

answered Jan 7, 2013 at 1:46

Okan Kocyigit

13.5k18 gold badges74 silver badges132 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Marek123 Over a year ago

Nope, this wasn't the solution. The slider still wants to load the angular scope : slider/%7B%7Bimage%7D%7D 404 (Not Found)

Okan Kocyigit Over a year ago

@Marek123, I think there is an error on image link, did you encode it?

Collectives™ on Stack Overflow

AngularJS - Call jquery after load

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related