如何制作新行或在数组中中断？

Question

I have a popover and I want to have break between each items in content- data.

 %i.fa.fa-folder.item{"data-content" => "#{folder.doc.map{ |file_id| File.find(file_id).name}.join{"<br />"}.html_safe}",rel: "popover", title: "title:"}

I have added "\\n" to the the join but its not working. Do you have any idea where should I put the "\\n" in the code?

Answer 1

\\n is not rendered as a newline in HTML. Use <br /> tag instead:

 #{folder.doc.map{ |file_id| File.find(file_id).name}.join("<br />").html_safe}",rel: "popover", title: "title: 

Answer 2

If this is being displayed in a browser then a \\n will only put a newline character in the code . The HTML newline tag is <br /> . However, without knowing more about the general context you are using this in it is hard to give you good advice.

Normally if I am making a list of things then I would wrap the whole list in, say, a <ul> tag, and each list item in an <li> ... Or possibly each one should be wrapped in a <div> .

The thing about HTML, like most programming languages, is that there are many ways to do an arbitrary thing, but there are better ones or worse ones depending on the bigger picture

Answer 3

Adding a newline will not work, as HTML will ignore any whitespace/newlines to best format string as contiguous as possible. So you have to use <br/> to add an explicit line-break in HTML. However, now, in rails for safety any string will be html-escaped unless you explicitly instruct rails to not do that.

So in your case you want to build the list of files, claim it is safe, and then set as content. Something like

- file_list = folder.doc.map{|file_id| File.find(file_id).name}.join('<br/>').html_safe
%i.fa.fa-folder.item{data: {content: file_list, html: "true", rel: "popover", title: "title:"}

Secondly, because you are using bootstrap to render the popover, you will also have to instruct the bootstrap popover that the data-content is interpreted as html and should not be escaped (by setting the data-html attribute).

Answer 4

For that case I would recommend using a helper

Helper

module MyHelper
  def render_data_content(folder)
    folder.doc.map do |file_id| 
      File.find(file_id).name
    end.join('<br/>').html_safe
  end
end

View

%i.fa.fa-folder.item{"data-content" => render_data_content(folder) ,rel: "popover", title: "title:"}