twig.

Symfony2でtwigを使ったレンダリング.

twigについて

フランスのSensioLabsがスポンサードしている標準バンドルパッケージの1つ.

構文には以下の2種類がある↓↓↓

① 変数や式の結果をテンプレートに出力します。
{ {・・・} }

②テンプレートのロジックを制御するタグで、forループなどの命令実行に利用されます。
{ %・・・% }               

Symfony2をダウンロードすれば標準でtwigを利用可能.

ダウンロードせずとも、twig公式サイトからダウンロードすれば単体で利用可能.

テンプレートは継承可能

ヘッダー/フッターなど共通テンプレート化で、柔軟に利用可能.

<div id="sidebar">
    { % block sidebar % }
        <ul>
            <li><a href="/">ホーム</a></li>
            <li><a href="/blog">ブログ</a></li>
        </ul>
    { % endblock % }
</div>
<div id="content">
    { % block body  % }{ %  endblock  % }
</div>             

base.html.twigを継承したテンプレートでは、block bodyの中にロジックを記載↓↓↓

{ % extends '::base.html.twig' %}

{ % block title %}ブログ記事の一覧{ % endblock % }

{ % block body % }
    { % for entry in blog_entries % }
        <h2>{ { entry.title } }</h2>
        <p>{ { entry.body } }</p>
    { % endfor % }
{ % endblock % }

例では配列[blog_entries]の要素から[title]と[body]を表示.

for文で配列要素にアクセスする方法

配列要素にアクセスするには配列変数.要素名でアクセス.

{ % for item in navigation % }
    <li>item.index</li>
{ % endfor % }

twigでのif文処理の方法

PHPのif構文と同じ様にif 〜 else構文で制御.

{ % if item is empty % }
    <p>商品の在庫がありません!</p>
{ % else % }
    <p>商品に在庫があります!</p>
{ % endif % }

フォームレンダリング処理方法

フォームフィールドのラベルやエラーをを簡単に表示することが可能.

//twig上での記載
<div>
    { { form_label(form.age) } }
    { { form_errors(form.age) } }
    { { form_widget(form.age) } }
</div>

//HTMLへレンダリングされると以下のようになります。
<div>
    <label for="form_age">Age</label>
    <ul>
        <li>This field is required</li>
    </ul>
    <input type="number" id="form_age" name="form[age]">
</div>

Formでレンダリングしてみる

Formクラスを利用すれば、レンダリングやバリデーションは簡単に行える.

以下ControllerクラスではSampleIndexTypeのインスタンスを引数にcreatForm実行.

//SampleController.php
namespace Test\SampleBundle\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\Controller;
use Test\SampleBundle\Form\Type\SampleIndexType;
use Test\SampleBundle\Entity\SampleEntity;

class SampleController extends Controller 
{
    public function indexAction()
    {
        $form = $this->createForm(new SampleIndexType, null);
        return $this->render(
               'SampleBundle:Default:index.html.twig', array("form" => $form->createView()));
    }
}

引数のSampleIndexTypeではレンダリングしたForm要素定義.

//SampleIndexType.php
namespace Test\SampleBundle\Form\Type;

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;

class SampleIndexType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder->add('textTest', 'text', array('required' => false));

        $builder->add('checkTest', 'choice', array(
            'choices' => array(
                1 => 'あり',
                2 => 'なし'
            ),
            'expanded' => true,
            'multiple' => true,
            'data' => array(1, 2)
        ));

    }

    public function getName()
    {
        return 'test';
    }

    public function setDefaultOptions(OptionsResolverInterface $resolver)
    {
        $resolver->setDefaults(array('csrf_protection' => false));
    }
}

今回のForm定義ではテキストフィールドとチェックボックスを定義.

テキストフィールドでは、array(‘required’ => false)で必須入力チェックをOFF設定.

何も記載しなければtrueとなり、HTML5のrequire属性がtrueで設定される.

//テキストフィールルド
{ { form_label(form.textTest, 'テスト件数', {'label_attr' : {'class': 'middle'} }) } }
{ { form_widget(form.textTest, { 'attr': {'class': 'form-control'} }) } }

//チェックボックス
{ { form_label(form.checkTest, '', {'label_attr' : {'class': 'middle'} }) } }
{ % for checkTestChildren in form.checkTest % }
    { { form_widget(checkTestChildren) } }
    { { checkTestChildren.vars.label } }
{ % endfor % }

twig上でForm要素をレンダリングする際にはform_widgetを利用.

Fin.