代码之家 › 专栏 › 技术社区 › codegirl

在Bootstrap Popover Rails 5应用程序中呈现部分?

html-safe bootstrap-popover ruby-on-rails html javascript

codegirl · 技术社区 · 6 年前

我在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 一点运气都没有。

*添加示例* 下面是我使用 保险箱 和 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中使用部分样式?? 还是我做错了?

请告诉我提前谢谢。

3 回复 | 直到 6 年前

DaudiHell 6 年前

我相信你必须 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' %>" >

Jake 6 年前

默认情况下,引导弹出窗口不接受通过自动继承选项输入的HTML: data-html="false" 您需要添加并将其更改为 true .

如果您想进一步了解可以通过哪些选项来启动弹出窗口,请查看 this section of their API 你可以回顾一下你能用它做些什么。

gwcodes 6 年前

您的引导标记和js看起来很不错,所以问题几乎肯定是您的视图输出的是转义html,而不是您需要的标记。

你的尝试 html_safe 是非常接近和肯定在正确的轨道上,但缺乏括号意味着它不完全做你认为。请改为:

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

请注意 保险箱 应用于 render ,外部引号保留在html中,不由rails解释。