Home > php教程 > php手册 > symfony2 twig模板引擎,symfony2twig模板

symfony2 twig模板引擎,symfony2twig模板

WBOY
Release: 2016-06-13 08:45:56
Original
843 people have browsed it

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 %}

# 会将&lsquo;AppWebBundle/Resources/public/js/&rsquo;目录下所有的js文件依次输出<br />{% block my_js %<span>}
    {</span>% javascripts '@AppWebBundle/Resources/public/js/*' %<span>}
        </span><script type="text/javascript" src="{{ asset_url }}"></script><span>
    {</span>% endjavascripts %<span>}
{</span>% endblock %}
Copy after login

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

assetic:<span>
    bundles</span>:        [ AppWebBundle ]
Copy after login

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

<span>#<span>layout.html.twig</span><br />...<br /><</span><span>head</span><span>></span>
        <span><!--</span><span>start globalcss </span><span>--></span><span>
        {% 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'
            %}
                </span><span><</span><span>link </span><span>rel</span><span>="stylesheet"</span><span> href</span><span>="{{ asset_url }}"</span><span>></span><span>
            {% endstylesheets %}
        {% endblock %}
        </span><span><!--</span><span>end globalcss </span><span>--></span>
        
        <span><!--</span><span>start globaljs </span><span>--></span><span>
        {% block global_js %}
            {% javascripts '@AppWebBundle/Resources/public/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js' %}
                </span><span><</span><span>script </span><span>type</span><span>="text/javascript"</span><span> src</span><span>="{{ asset_url }}"</span><span>></</span><span>script</span><span>></span><span>
            {% endjavascripts %}
        {% endblock %}
        </span><span><!--</span><span>end globaljs </span><span>--></span><span>
        
        {% block my_js %}
        {% endblock %}
        
        {% block my_css %}
        {% endblock %}
</span><span></</span><span>head</span><span>></span>
Copy after login
<span>#index.html.twig<br />{% extends "AppWebBundle::layout.html.twig" %}
{% block maincontent %}

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

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

{% block footer %}
    {{ parent() }} //会沿用父页面的footer,不被重写
{% endblock %}
{% endblock %}</span>
Copy after login

 

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template