ng2 + webpack refer html dom элемент во внешней библиотеке

Question

Hello Angular 2 и разработчики Webpack, Я работаю с угловыми 2 и systemjs, так как довольно давно, новичок в webpack (начинающий любить его с некоторой битвой).

У меня есть компонент, который имеет HTML следующим образом:

<div id="partners-slider" class="partners"> 
     <div class="partners__slider js-slick-slider"> 
      <a class="partners__item"><img src="assets/logo-company-1.png" alt="">Elite Construction Group, LLC</a> 
      <a class="partners__item"><img src="assets/logo-company-2.png" alt="">Pro Era Limited</a> 
     </div></div> 

Сво основном слайдер. У меня есть библиотека, которую я использую во многих проектах, для анимаций и материалов.

Theres функции следующим образом, что инициирует бегунок:

function initPartnersSlider(container) { 
var $partnersSlider = $(container) ; 
if (!$partnersSlider.length) return; 

$partnersSlider 
    .find('.js-slick-slider') 
    .slick({ 
    dots: false, 
    infinite: true, 
    speed: 300, 
    slidesToShow: 5, 
    autoplay: true, 
    accessibility: false, 
    prevArrow: $partnersSlider.find('.js-partners-prev'), 
    nextArrow: $partnersSlider.find('.js-partners-next'), 
    responsive: [ 
     { 
     breakpoint: 1100, 
     settings: { 
      slidesToShow: 4 
     } 
     }, 
     { 
     breakpoint: 1000, 
     settings: { 
      slidesToShow: 3 
     } 
     }, 
     { 
     breakpoint: 768, 
     settings: { 
      slidesToShow: 1 
     } 
     } 
    ] 
    });} 

вызов функции:

initPartnersSlider('#partners-slider'); 

Проблема здесь $partnersSlider.length всегда 0.

Согласно моему пониманию, HTML, элемент помещается внутри файла с расширением webpack (prod)

main.bundle.js

Я имею в виду мой внешний файл Javascript внутри index.html в качестве тега сценария. Кажется, он не распознает элемент dom с id="properties-slider", так как элемент находится внутри main.bundle.js ?. Я могу отлаживать и видеть его в моем коде библиотеки.

Кто-нибудь сделал это раньше? Спасибо за любую помощь!

Answer 1

Вероятное решение этой проблемы имеет установочный параметр перед вызовом методов. Если есть лучшие решения, напишите.

setTimeout(() => { 
    initPartnersSlider('#partners-slider'); 
    }, 0); 

Не очень убедительно, но работал на меня.