Рендеринг частичного в загрузочном поповер рельсы 5 приложение?

Question

У меня проблема с рендерингом партиала в загрузочном поповере в моем приложении 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 %>" - текст отображается как обычный текст

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

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

Answer 1

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

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

<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' %>" >

Answer 2

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

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

Answer 3

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

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

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

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