Ruby on Rails メッセージ機能でラインのようなデザイン

###前提・実現したいこと
rails4 ローカル環境

現在メッセージ機能を実装してラインのようなメッセージのやりとりができるようにしたいと思っています。

###発生している問題・エラーメッセージ
メッセージ機能は無事に実装できたのですが、メッセージのやり取りをしているページで『相手のメッセージは左側』『自分のメッセージは右側』という表示の仕方が分からず苦戦しています。

どのようにしたら相手のメッセージと自分のメッセージを区別して表示できるのでしょうか？

###該当のソースコード
現在はこのように記述しています。

messages.index.html.erb
1    <div class="ui segment">
2      <% @messages.each do |message| %>
3        <% if message.body %>
4          <% user = User.find(message.user_id) %>
5            <strong><%= user.name %></strong>
6            <%= message.message_time %>
7            <div class="item">
8              <i class="right triangle icon"></i>
9              <%= message.body %>
10            </div>
11        <% end %>
12      <% end %>
13    </div>

相手と自分のメッセージを上記記述で表示して、正常に表示はできているのですが、これでは一覧になってメッセージのやり取りが表示されているだけで、『相手のメッセージは左側』『自分のメッセージは右側』という理想の表示にはできません。

どのように記述したらいいか教えてください。

他に必要なコードがあれば追記しますので、その際はお声がけください。
よろしくお願いします。

行動規範の内容に同意します

回答1件

ベストアンサー

こんな感じでしょうか。

erb
1<% if message.user_id == [自分のID] %>
2  <!-- 自分のメッセージ -->
3  <% user = User.find(message.user_id) %>
4  <strong><%= user.name %></strong>
5  <%= message.message_time %>
6  <div class="item">
7    <i class="right triangle icon"></i>
8    <%= message.body %>
9  </div>
10<% else %>
11  <!-- 相手のメッセージ -->
12<% end %>

投稿2017/03/28 04:19

KaiShoya

総合スコア551

riamk

2017/03/28 04:42

ご回答ありがとうございます。教えて頂いたコードでさっそく試してみました。 <% if message.user_id == [自分のID] %> こちらは<% if message.user_id == current_user.id %> と自分のIDを入れてやりました。すると undefined local variable or method `message' とエラーになってしまったので、 <% if @message.user_id == current_user.id %> としてみたのですが、メッセージが１件も表示されない状態です。どのように修正したらいいかアドバイス頂けると嬉しいです。