一番いいねが多い投稿の画像を表示したい

Question

songの中にcommentがあり、１対多の関係になっていて、commentはそれぞれ画像を持っているのですが、
song一覧にcommentにある一番いいねの数が多いimageを載せたいです。

 <% @songs.each do |song| %>
          <div class="col-md-4 col-sm-6 portfolio-item">
            <a class="portfolio-link" data-toggle="modal" href="#portfolioModal1">
              <div class="portfolio-hover">
                <div class="portfolio-hover-content">
                  <i class="fa fa-plus fa-3x"></i>
                </div>
              </div>
              <%= image_tag song.comments.image.url(:medium).order(:cached_votes_up => :desc).limit(1) %>
              <img class="img-fluid" src="/assets/noimage.jpg" alt="">
            </a>
            <div class="portfolio-caption">
              

としたのですが、エラーが出ます。

commentsにはimageがあるので、なぜここでimageがno method errorになるのかわかりません。
また、アソシエーションはできているはずです

class Song < ActiveRecord::Base
    acts_as_votable
    belongs_to :user
    has_many :comments, :dependent => :destroy
end

class Comment < ActiveRecord::Base
  acts_as_votable
  belongs_to :user
  belongs_to :song
  
  has_attached_file :image, styles: { :medium => "400x400#", :thumb => "180x180#" }, :default_url => "noimage.jpg"
  validates_attachment_content_type :image, content_type: /\Aimage/.*\Z/
end

どうしたら解消できるでしょうか？

Answer 1

こんにちは！

エラーを見ると undefined method image for #<ActiveRecord::Associations::CollectionProxy[]> と表示されているかと思いますが、これはsongs.commentsで取得した結果がcommentそのものではなく、commentの一覧を取得しているため、メソッドが読み出せずエラーになっています。

ですので、まずはsongs.comments.firstなどでcommentを取得してあげると、imageメソッドを呼び出すことができるかと思います。

今回はcached_votes_upで並び替えて取得しているので、ひとまず以下のようにしてみてはどうでしょうか？

<%= image_tag song.comments.order(:cached_votes_up => :desc).first.image.url(:medium) %>

また、検索条件について、いいね順に取得するのであれば、scopeで定義してあげたほうが、よりスッキリと書けて良いとおもいます。

class Comment < ActiveRecord::Base
  default_scope { order(cached_votes_up: :desc) }
end

<%= image_tag song.comments.first.image.url(:medium) %>