Slick popver angular

Vote count:

0

I have a slick (Ken Wheeler) and now I am trying to add a popover to it. I already had a custom-directive in Angular. Now, the problem is I am adding slides using slickAdd function which adds DOM elements on the fly. I am not able to get the custom directive (popover) working.

Main Div:

<div>
  <h3>My Projects</h3>
  <div class="carsl">
  </div>
</div>

JQuery Code:

var startDiv = '<div class=""><a custom-popover = "switchProject('
                var midDiv = ')" title="Switch Project" buttonname = "Switch"> <div class="carousel-project-name"> <h5>';
                var midDiv2 = '</h5> </div> <img src=\"';
                var endDiv = '\"class="homeimg"></a></div>';
                    $('.carsl').slick({
                        autoplay: false,
                        arrows: true,
                        dots: false,
                        slidesToShow: 3,
                        slidesToScroll: 3,
                        useCSS: false,
                        infinite: true
                    });

                for (var i = 0; i < $scope.projects.length; i++){
                    var addThis = startDiv + $scope.projects[i].name + midDiv + $scope.projects[i].name + midDiv2 + $scope.projects[i].preview + endDiv;
                    $('.carsl').slickAdd(addThis);
                }

Is there a way where I can tell Angular to rescan the div with class carsl so that the custom-popver gets binded to angular?

Any other way to implement is also appreciated with ng-repeat and carousel. But I would like to refrain from building a new directive for the Carousel.

asked 4 mins ago

maddog

11

Slick popver angular