Оказание частичного в bootstrap popover rails 5 приложений?

У меня проблема с частичным в загрузке в моем приложении rails.

Частично всегда отображается как обычный текст (показывающий все теги HTML и т.д.).

это код из index.html.erb

<span class="has-popover"
      style="cursor:pointer;"
      data-toggle="popover"
      data-trigger="hover"
      data-container="body"
      data-placement="right"
      title="Lorem Ipsum"
      data-content= "<%= render :partial => 'envs/e1' %>" >
      <i class="fa fa-question-circle "  aria-hidden="true"></i>
</span>

В app.js меня есть этот фрагмент

$(".has-popover").popover({
    html : true
});

и это _e1.html.erb в папке envs

<h2>Mauris euismod sollicitudin?</h2>

<p>Morbi sit amet tellus pellentesque, maximus eros a, aliquam nunc. Vivamus velit velit, vestibulum at eros eu, iaculis hendrerit tortor. Morbi ullamcorper purus at ornare ullamcorper. </p>

<br>

<p>Morbi sit amet tellus pellentesque, maximus eros a, aliquam nunc. Vivamus velit velit, vestibulum at eros eu, iaculis hendrerit tortor. Morbi ullamcorper purus at ornare ullamcorper. </p>

Я обернул "<%= render :partial => 'envs/e1' %>" эту строку как в raw() и в html_safe без везения.

* ДОБАВЛЕННЫЕ ПРИМЕРЫ * ниже приведены примеры того, как я использовал html_safe и raw в отрезанных

data-content= raw("<%= render :partial => 'envs/e1' %>") - текст появляется как "правильный", но вне сайта.

data-content= "<%= raw(render :partial => 'envs/e1') %>" > - текст отображается как обычный текст

data-content= "<%= render :partial => raw('envs/e1') %>" > - текст отображается как обычный текст

data-content= "<%= render :partial => 'envs/e1' %>".html_safe - текст отображается как обычный текст

data-content= "<%= render :partial => 'envs/e1'.html_safe %>" - текст отображается как обычный текст

должен быть какой-то способ иметь частичный стиль внутри popover? Или я делаю все это неправильно?

пожалуйста, сообщите мне заранее.

Ответ 1

Я считаю, что вам нужно включить data-html = "true" в ваш popover span. По крайней мере, это работало на моей машине.

Так что это было бы написано так:

<span class="has-popover"
  style="cursor:pointer;"
  data-toggle="popover"
  data-trigger="hover"
  data-html="true" <!-- This is what you have to add to the code -->
  data-container="body"
  data-placement="right"
  title="Lorem Ipsum"
  data-content= "<%= render :partial => 'envs/e1' %>" >

Ответ 2

По умолчанию всплывающие окна Bootstrap не принимают html, введенный в них, автоматически наследуя параметр: data-html="false" который нужно добавить и изменить на true.

Если вы хотите узнать больше о том, какие параметры вы можете пройти, загрузите их, загрузите их в этот раздел своего API и вы сможете просмотреть, что вы можете с ним сделать.

Ответ 3

Ваша разметка Bootstrap и JS выглядят прекрасно, поэтому проблема почти наверняка заключается в том, что ваше представление выводит экранированный HTML, а не разметку, которая вам нужна.

Ваши попытки с html_safe очень близки и определенно на правильном пути, но отсутствие скобок означает, что это не совсем то, что вы думаете. Попробуйте это вместо этого:

data-content="<%= render(partial: 'envs/e1').html_safe %>"

Обратите внимание, что html_safe применяется к выходу render, а внешние кавычки сохраняются в HTML и не интерпретируются Rails.