投稿されたコメントを表示したく、またそれぞれの頭に黒丸をつけたいのですが、なぜかリストの1つ目にしか表示されません。
2つ目以降にも表示するにはどうしたら良いでしょうか?
Ruby
<div class="record__comments"> <% if user_signed_in? %> <%= form_with(model: [@record, @comment], local: true) do |form| %> <div class="field"> <%= form.label :text, "コメント" %><br /> <%= form.text_area :text, class: :comment_content %> </div> <div class="actions"> <%= form.submit "送信する", class: :form__btn %> </div> <% end %> <% else %> <strong><p>※※※ コメントの投稿には新規登録/ログインが必要です ※※※</p></strong> <% end %> <ul class="comments_lists"> <li class="comments_list"> <% @comments.each do |comment| %> <p> <%= comment.text %> <%= link_to "(#{comment.user.nickname})", "/users/#{comment.user_id}", class: :comment_user %> </p> <% end %> </li> </ul> </div>
CSS
.record__comments{ background-color: #f6f6f6; width: 100%; padding: 20px; margin: 28px 0 40px 0; } .comments_lists{ padding-left: 20px; } .comments_list{ display: list-item; list-style-type: disc; margin-left: 24px; padding-bottom: 5px; } .comment_content{ width: 600px; } .comment_user{ font-size: 16px; color: #999; text-decoration: underline; }
HTML
<div class="record__comments"> <form action="/records/14/comments" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="7ad5bZXwvWootzACi7mi4iHevnnD028CLK7tBRbwcYuBKqWoMhcGYF3mUtaOyvgtog6temq+NCxNAV7+bRCM7g==" /> <div class="field"> <label for="comment_text">コメント</label><br /> <textarea class="comment_content" name="comment[text]" id="comment_text"> </textarea> </div> <div class="actions"> <input type="submit" name="commit" value="送信する" class="form__btn" data-disable-with="送信する" /> </div> </form> <ul class="comments_lists"> <li class="comments_list"> <p> テスト <a class="comment_user" href="/users/1">(test)</a> </p> <p> test <a class="comment_user" href="/users/1">(test)</a> </p> <p> test <a class="comment_user" href="/users/1">(test)</a> </p> <p> test <a class="comment_user" href="/users/2">(quina)</a> </p> <p> tttttttttttttttttttttttttttttttttttttttttttttttttt <a class="comment_user" href="/users/2">(quina)</a> </p> </li> </ul> </div>
まだ回答がついていません
会員登録して回答してみよう