Используйте шаблон начальной загрузки с нестандартным стилем в угловых 2+ - PullRequest
Новая
       29

Используйте шаблон начальной загрузки с нестандартным стилем в угловых 2+

0 голосов
/ 22 апреля 2019

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

Несмотря на то, что библиотека предоставляет возможность указать шаблон с помощью опции template, у меня возникают трудности при указании scss для того же. Это не принимает глобальные стили веб-сайта.

HTML передается в виде строки. потому что это ожидаемый доход для этого варианта

Шаблон, который я использую 

    export const customHtmlTemplate = `
<div class="popover">
  <div class="arrow"></div>
  <div class="popover-close">
    <i data-role='end' class="ficon ficon-cross property-close"></i>
  </div>
  <h3 class="popover-title">Some default title that gets overridden</h3>
  <div class="tour-popover popover-content"></div>
  <div class="popover-navigation">
    <button class="secondary"  data-role="prev">Prev</button>
    <button class="secondary"  data-role="next">Next</cn-button>
    <button class="primary"  data-role="end"><span>Got It!</span></cn-button>
  </div>
</div>
`;

Я передал его в файл машинописи 

    this.tour = new Tour({
      debug: true,
      storage: false,
      delay : false,
      backdrop: true,
      backdropPadding : 1,
      template: customHtmlTemplate,
      steps: [{
        element:

, но глобальные CSS и все остальное не применяются, когда компонент инициализируется и запускается при нажатии кнопки.

Любая идея, как это сделать. Справка: http://bootstraptour.com/api/

...