How to remove square brackets and commas from array

Question

I'm creating a tooltip for Likes. Here's an images which I'm passing to tooltip:

images = bonus.like_user_avatars.map {|src| "<img src='#{src}'>" }

bonus.like_user_avatar is already a collection of the liked user's avatar. Everything works fine, but it looks like this:

This is the tooltip code:

span.has-tip data-tooltip="" data-template="<div class='tooltip'>#{images}</div>"Like

I need to remove the square brackets and commas, I just want only the avatars in tooltip. How can I do it?

Answer 1

Two possiblities:

1. You probably need to tell rails that your HTML is safe. Call .html_safe on the string when you render it.

2. I would rather save of the src attributes in the bonus.like_user_avatars as you've done, and then add them into the html upon render through a rails method. For example in your view (assuming you're using slim from your previous syntax).

    - bonus.like_user_avatars.each do |src| = image_tag src, #any options you want here 

Note : http://apidock.com/rails/ActionView/Helpers/AssetTagHelper/image_tag will help with the image_tag method

Answer 2

There is a difference between map and each .

2.3.0 :001 > array = [1,2,3]
 => [1, 2, 3]
2.3.0 :002 > array.map {|v| v+1}
 => [2, 3, 4]
2.3.0 :003 > array.each {|v| v+1}
 => [1, 2, 3]

map is used when you want to transform the original list (it does not mutate). When you use map , you are just creating a new list with the new values. each should be used when you want to have some kind of effect, in this case, you are outputting something.

In your case, you will want to use bonus.like_user_avatars.each

Answer 3

Just join the values in array

images.join # <img src='a.jpg'><img src='b.jpg'><img src='c.jpg'>

Just replace the code with following:

span.has-tip data-tooltip="" data-template="<div class='tooltip'>#{images.join}</div>"Like