Hamlで二次元配列の内容をループさせて表示する

タイトル：Hamlで二次元配列の内容をループさせて表示する

目的：Ruby+Sinatra側でCSVを読み込み、そのデータをHamlでループさせて表示する。

実行環境
OS：Windows8.1
Ruby：v2.2.2
Sinatra：v1.4.6
Haml：v4.0.6

ディレクトリ構造

作業ディレクトリ
|- sinatra-start.rb（ファイル）
|- views（ディレクトリ）
|　- index.haml（ファイル）
|- resources（ディレクトリ）
　 - bbs-data.csv（ファイル）

csvのテスト用データは各自でご用意して下さい。
（文字コードはUTF-8を想定してプログラムしています。）

目次：

1. Ruby(Sinatra)ソース作成
2. Hamlソース作成
3. 説明＆テスト

以下の記事を以前に見て頂いたことがある方は、

ソースコードに追記する形で実施すると楽です。

Hamlを使ってみた。

1.Ruby(Sinatra)ソース作成

Rubyのソースコードは以下の通り作成した。

sinatra-start.rb

	# encoding: utf-8
	# File Name: sinatra-test.rb
	# Create Day is 2015/05/08
	# Last Update Day is 2015/05/14
	# Gem List
	gem 'tilt', '1.4.1'
	# Require List
	require 'sinatra'
	# sinatra reloader is classic type
	require 'sinatra/reloader' if development?
	require 'haml'
	require 'tilt'
	require 'csv'
	# 外部エンコーディングを変更
	Encoding.default_external = "UTF-8"
	get '/' do
	@title = "Hello world!!"
	@text = "Hello Haml!!"
	@bbs_data = CSV.read("resources/bbs-data.csv")
	haml :index
	end

view raw sinatra-start.rb hosted with ❤ by GitHub

2.Hamlソース作成

Hamlのソースコードは以下の通り作成した。

index.haml

	!!!
	-# %TagName(html)で記述
	%html{:lang => "ja"}
	%head
	-# 「%TagName= @EmmbeddingName」で出力
	%title= @title
	%body
	-# 「%TagName #{@EmmbeddingName}で出力」
	%h1 #{@title}
	%p= @text
	- @bbs_data.each do |row|
	%p= row
	- row.each do |element|
	%p= element

view raw index.haml hosted with ❤ by GitHub

3.説明＆テスト

3.1

Ruby側の説明

エンコーディングの設定をUTF-8に変更しています。

@bbs_dataと言うインスタンス変数に対して、

読み込んだCSVデータ（二次元配列）を代入しています。

こちら側でやっていることはこれくらいですね。

3.2

Haml側の説明

Hamlにて、-（ハイフン）を記述するとRubyのコードを記述することができるようになります。

なので、@bbs_dataをeachでループさせることができるわけですね。

Rubyで設定した@bbs_dataを（二次元配列なので）二回ループさせて値を取り出しています。

表示は、配列のままも出せますし、個々の値を出すこともできます。

くぅ～、今日は時間がなかった...少し説明不足で全体的な進行が遅いな。

まぁ、仕方ないか...初めて触るものばかりですし...

現在は、パーツを集めている段階です。

各記事の内容が組み合わさって掲示板になるかと思います。

もしかしたら、Rubyの環境構築を実施した時のようにまとめ記事を作成するかもしれません。

以上！！