見出し画像

繰り返し処理で区切った最後の余計なカンマを消す

繰り返し処理で表示した要素をカンマで区切った時の最後の余計なカンマを消したい。

 <% @areas.each do |area| %>
   <div><%= area.name %>、</div>
 <% end %>

舞浜の後に余計なカンマがついてしまっている。

スクリーンショット 2021-11-11 20.01.09

これを↓のようにしたい。

スクリーンショット 2021-11-11 20.03.15

jQueryでこのように書いて消した。
やっていることとしては、繰り返した最後の要素のテキストを書き換えている。


$(function(){
 const lastElem = $('.selected-area-item').last()
 const lastElemText = lastElem.text()
 const changedLastElemText = lastElemText.substring(0, lastElemText.length - 1);
 $(lastElem).text(changedLastElemText);
});

もっといい方法があれば教えてください!

追記

もっといい方法ありました。。!
こちらの方がview内で完結するのでよいですね。

<% @areas[0...-1].each do |area| %>
 <div><%= area %>、</div>
<% end %>
<div><%= @areas.last %></div>

参考

https://stackoverflow.com/a/14849847

いいなと思ったら応援しよう!