symfony2 twig模板引擎，symfony2twig模板

1、基本语法

Says something：{{ }}

Does something：{% %}

Comment something：{# #}

{% extends "AppWebBundle::layout.html.twig" %}继承模板

2、核心概念：

用类的继承关系去管理页面之间的关系

如果要访问某个bundle里的资源文件，需要将文件拷贝到/web 目录下，或者linux/mac 软连接映射到/web目录下

windows: >php app/console assets:install web

linux: >php app/console assets:install web --symlink --relative

3、js css文件管理

（1）直接使用某个CSS/JS文件：{{asset('xxx.js')}}

（2）注册/定义资源：{% javascripts %} {% stylesheets %}

# 会将‘AppWebBundle/Resources/public/js/’目录下所有的js文件依次输出
{% block my_js %}
    {% javascripts '@AppWebBundle/Resources/public/js/*' %}
        
    {% endjavascripts %}
{% endblock %}

登录后复制

并在app/config/config.yml配置：

assetic:
    bundles:        [ AppWebBundle ]

登录后复制

（3）页面间共享CSS/JS文件的通用策略

#layout.html.twig
...
<head>
        
        {% block global_css %}
            {% stylesheets 
                '@AppWebBundle/Resources/public/css/bootstrap.min.css'
                '@AppWebBundle/Resources/public/css/bootstrap-theme.min.css'
                '@AppWebBundle/Resources/public/css/main.css'
            %}
                <link rel="stylesheet" href="{{ asset_url }}">
            {% endstylesheets %}
        {% endblock %}
        
        
        
        {% block global_js %}
            {% javascripts '@AppWebBundle/Resources/public/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js' %}
                <script type="text/javascript" src="{{ asset_url }}">script>
            {% endjavascripts %}
        {% endblock %}
        
        
        {% block my_js %}
        {% endblock %}
        
        {% block my_css %}
        {% endblock %}
head>

登录后复制

#index.html.twig
{% extends "AppWebBundle::layout.html.twig" %}
{% block maincontent %}

{% block my_js %}
    {% javascripts '@AppWebBundle/Resources/public/js/index/*' %}
        <script type="text/javascript" src="{{ asset_url }}">script>
    {% endjavascripts %}
{% endblock %}

{% block my_css %}
    {% stylesheets '@AppWebBundle/Resources/public/css/index/*' %}
        <link rel="stylesheet" href="{{ asset_url }}">
    {% endstylesheets %}
{% endblock %}

{% block footer %}
    {{ parent() }} //会沿用父页面的footer，不被重写
{% endblock %}
{% endblock %}

登录后复制