Javascript с главной страницы теряется после частичной загрузки с использованием углового UI-маршрутизатора

ОБНОВИТЬ

Я думаю об использовании следующего решения, это хороший способ?


Я работаю над проектом, который переносится с WordPress на AngularJS (позже будет иметь свой собственный бэкэнд). Некоторые из необходимых файлов JavaScript, которые уже были там, должны остаться.

Я использую угловой UI-маршрутизатор, чтобы сохранить те же маршруты, которые были там раньше, с состояниями, необходимыми библиотеке.

Вот моя проблема, у меня есть следующие файлы, загруженные в основной файл "index.html":

<script type='text/javascript' src='/wp-content/themes/twentyfourteen-child/assets/js/bootstrap.min0c54.js?ver=150923'></script>
<script type='text/javascript' src='/wp-content/themes/twentyfourteen-child/assets/js/svg-injector-min5b31.js?ver=4.3.1'></script>
<script type='text/javascript' src='/wp-content/themes/twentyfourteen-child/assets/js/bootstrap-select.min0c54.js?ver=150923'></script>
<script type='text/javascript' src='/wp-content/themes/twentyfourteen-child/assets/js/jquery.matchHeight.min0c54.js?ver=150923'></script>
<script type='text/javascript' src='/wp-content/themes/twentyfourteen-child/assets/js/imgw-mina8b3.js?ver=150526'></script>
<script type='text/javascript-lazy' src='/wp-content/themes/twentyfourteen-child/assets/js/jquery-cycle2.min0c54.js?ver=150923'></script>
<script type='text/javascript-lazy' src='/wp-content/themes/twentyfourteen-child/assets/js/scrollTo.min0c54.js?ver=150923'></script>
<script type='text/javascript-lazy' src='/wp-content/themes/twentyfourteen-child/assets/js/imgw_home_scripts-min0c54.js?ver=150923'></script>

Эти файлы обязательны. Теперь, когда я направляю на конкретный URL, скажем, например:

/a-new-url

который указывает на шаблон:

/partial/a-new-url.html

Так, например, у этого шаблона есть карусель, которая использует один из этих файлов javascript, однако карусель больше не будет работать, если я не скопирую и не вставлю теги сценария в партиал. Теперь это плохое решение и приведет к избыточности, так как мне придется делать это с каждым отдельным частичным.

Как правильно решить эту проблему?

Код для карусели (по запросу)

в index.html есть следующие файлы в теге body:

<script type='text/javascript-lazy' src='/wp-content/themes/twentyfourteen-child/assets/js/jquery-cycle2.min0c54.js?ver=150923'></script>
<script type='text/javascript-lazy' src='/wp-content/themes/twentyfourteen-child/assets/js/scrollTo.min0c54.js?ver=150923'></script>
<script type='text/javascript-lazy' src='/wp-content/themes/twentyfourteen-child/assets/js/imgw_home_scripts-min0c54.js?ver=150923'></script>

Мое расследование показывает, что этот html загружает его автоматически на основе "id=home-slideshow"

<div id="home-slideshow">
  <div id="slides" class="home-slider">
    <div class="slide" style="background-image: url(/wp-content/uploads/2014/05/home.jpg);">
    </div>
    <div class="slide" style="background-image: url(/wp-content/uploads/2014/05/1170780.jpg);">
    </div>
    <div class="slide" style="background-image: url(/wp-content/uploads/2014/05/ep.jpg);">
    </div>
  </div>
</div>

1 ответ

Решение

В итоге я использовал следующее решение, которого в моем случае более чем достаточно.

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

Другие вопросы по тегам