Ruby on Rails フォームで記入された値を個別に表示したい

Question

railsを使いフォームに記入した値を日別に集計し表示するカロリー計算アプリを作成中です。

環境
Cloud9
ruby -v 2.6.3
rails -v 6.0.3

マイグレーションファイル

class CreateCalories < ActiveRecord::Migration[6.0]
  def change
    create_table :calories do |t|
      t.float        :calorie
      t.date         :date
      
      t.timestamps
    end
  end
end

ルーティング

  get "/calorie", to: "calories#index"
  post "/calorie", to: "calories#create"

controller

class CaloriesController < ApplicationController
  def index
    @calorie = Calorie.new
    @calories = Calorie.group(:date).sum(:calorie)
  end
  
  def create
    @calorie = Calorie.new(calorie_params)
    if @calorie.save
      redirect_to action: "index"
    else 
      flash[:danger] = "値が正しくありません"
      render "index"
    end
  end
  
  
  
  private
  
    def calorie_params
      params.permit(:date, :calorie)
    end
end

view

<div class="contents">
  <p>摂取カロリーを記録してください</p>
  
  <%= form_with(url: calorie_path, local: true) do |f|  %>
    <%= f.label :calorie,  "calorie" %>
    <%= f.number_field :calorie %>
    
    <%= f.label :date, "日付" %>
    <%= f.date_field :date%>
    
    <%= f.submit "送信" %>
  <% end %> 
  
  
  
  <div class="output_calorie">
    <p>
      <%= @calories %> 
    </p>
  </div>
</div>

フォームに入力された値を一括で表示する箇所を下記のようにそれぞれ個別で表示したいのですが、
このような変更を加えるとエラーが発生してしまいます。

  <div class="output_calorie">
    <p>
       <%= @calories.date %>
       <%= @calories.calorie  %>
    </p>                  
  </div>
</div>

エラー

undefined method `date' for {Sun, 09 Jan 2022=>800.0, Mon, 10 Jan 2022=>800.0}:Hash
Did you mean?  update

indexアクションでのインスタンス変数の定義が原因かと考え色々試しましたが、解決できないのでアドバイスをいただきたいです。

Answer 1

@calories は個々では無いです。
個々にするには @calories.each do |calory|
にしてください

Answer 2

<% @calories.each do | date, calorie| %>
          <%= "日付" %>
          <%= date %>
          <%= "カロリー" %>
          <%= calorie %>
        <% end %>

each文の| |で要素を指定することで無事解決できました。