配列で取得した画像の表示方法がわからない

Question

解決したいこと

Itemモデルのビューに他のモデルから取得した画像を表示させたいのですがうまくいかない

現状

○コントローラー

  def index
    @items = Item.all
  end

○アソシエーション

class ItemImg < ApplicationRecord
  belongs_to :item
end

class Item < ApplicationRecord
  has_many :item_imgs, dependent: :destroy
end

○コンソール上

[1] pry(#<#<Class:0x00007f9d18af8ab8>>)> i.item_imgs[j]
=> #<ItemImg:0x00007f9d1d50a5e8
 id: 1,
 url: "child.jpg",
 item_id: 1,
 created_at: Thu, 06 Aug 2020 00:00:00 UTC +00:00,
 updated_at: Thu, 06 Aug 2020 00:00:00 UTC +00:00>
[2] pry(#<#<Class:0x00007f9d18af8ab8>>)> i.item_imgs[j].url
=> "child.jpg"

○ビュー

  - @items.each_with_index do |i, j|
    = i.item_imgs[j]

コンソール上ではうまく表示できているんですが、ビュー上で[ j ]の後ろに.urlを記述すると「 NoMethodError in Items#index 」のエラーが出ます。
また検証でみた際、div要素で囲まれていたのですが画像の表示なのでこれも1つの原因でしょうか？？
どなたか力をお貸しください、お願いします。

Comments

[gouf]

次のように書き換えた場合、なにか変化は見られますか?

````haml
- @items.each do |item|
- item.item_imgs.each do |img|
= img.url
end
```

[suguru060305]

なるほどと思い実践したら文字列で表示されたので、img.urlの前にimage_tagだけ付けてみたらうまく表示できました！！

配列で取得されるのでeachでまずitemsを1つずつ取り出し、もう1つのeachでitemsのidを持つ画像を1つずつ取り出し、その中のurlだけ呼び出している感じですね！！

めちゃめちゃ為になりました。しっかり順をおって取り出さないと行けない感じなんですね。
この方法知ったら結構いろんなところから持って来れそうです！！
本当にありがとうございましたーーー！！！！

[suguru060305]

せっかく協力してもらったのにベストアンサー押せない...。よかったら回答にコメントください..。

[gouf]

解決した場合、他者の回答ないし自己回答として内容をまとめて それをベストアンサーに設定することで、この質問を解決済みにすることができます

[suguru060305]

なるほど、ありがとうございます！！

Answer 1

コンソール上ではうまく表示できているんですが

item_imgs[j] がnilとなっているために起こっています。
コンソールでうまく表示できているのは(おそらく) j = 1 のときで、
ビューでエラーがおきているときの j の値は1ではないときだと思います。

@items.each do |item|
  item.item_imgs.each do |img|
    img.url
  end
end

のようにすると表示されると思います。