zoukankan      html  css  js  c++  java
  • twig模板的进一步学习以及在symfony当中的使用

    首先,twig可以理解为用于输出html代码的,虽然用PHP等其他语言也可以输出,但是twig更为简洁高效,同时twig模板被编译成原生的php类缓存起来,所以才会这么快,

    其实twig跟php类差不多我感觉,可以进行继承重写,创建一个基类模板,之后的模板都可以继承他并且重写他的任何一个block

    twig模板可以和for,if语句完美结合,比如下面这个例子,以无序方式循环输出用户名,同时根据用户名是否存在进行不同的操作 ,注意以{% endfor %}来结束for语句

    <ul>
        {% for user in users if user.active %}
            <li>{{ user.username }}</li>
        {% else %}
            <li>No users found</li>
        {% endfor %}
    </ul>

    下面以一个例子来说明twig其中的继承关系,可以看到base模板当中,定义了三个block,title,sidebar,body块,这里用{%block 块名%}  {%endblock%}来定义一个块

    title输出该页面的标题,sidebar是旁边的选项,body是文章的具体内容,这里可以看做是让其他模板继承并重写的,

    {# app/Resources/views/base.html.twig #}
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title>{% block title %}Test Application{% endblock %}</title>
        </head>
        <body>
            <div id="sidebar">
                {% block sidebar %}
                    <ul>
                        <li><a href="/">Home</a></li>
                        <li><a href="/blog">Blog</a></li>
                    </ul>
                {% endblock %}
            </div>
     
            <div id="content">
                {% block body %}{% endblock %}
            </div>
        </body>
    </html

     接下来我们以一个字模板来进行说明,比如现在有一篇文章,当进入该文章页面时,需要显示文章具体内容,文章页面和主页是差不多的,只是基类twig当中的body块是不一样的,

    所以只需要重写基类当中的body块就行了,就可以在原页面的基础上,只更改文章的内容而其他地方都是不变的。注意在此之前使用extends继承基类模板,就会自动显示基类模板

    当中的内容

    {# app/Resources/views/blog/index.html.twig #}
    {% extends 'base.html.twig' %}
     
    {% block title %}My cool blog posts{% endblock %}
     
    {% block body %}
        {% for entry in blog_entries %}
            <h2>{{ entry.title }}</h2>
            <p>{{ entry.body }}</p>
        {% endfor %}
    {% endblock %}

    说到底twig模板就是将各个页面之间的共性提取出来,写入到基类模板当中去,基类模板的block越多越好,这样页面更为灵活

    如果要在子类模板当中在基类模板的某一块的基础上添加内容,而不是完全重写,只需要将  {{ parent() }}放在所需要的块中即可,  

    对于模板存放位置的说明。

    基类模板一般存放在App/Resourses/views当中,可以继承第三方bundle当中的模板,注意如果你想要让基类继承其他的twig,需要放在bundle当中

    对于继承路径的说明,

    所有目录都是相对于app/resources/views目录的,比如你要继承views/blog的twig模板,需要使用 extends blog/模板名,

    对于在一个模板当中引入其他模板的说明

    比如现在有一个模板article.html.twig

    {# app/Resources/views/article/article_details.html.twig #}
    <h2>{{ article.title }}</h2>
    <h3 class="byline">by {{ article.authorName }}</h3>
     
    <p>
        {{ article.body }}
    </p>

    然后如果要在一个list.html.twig模板当中使用他的话,

    {# app/Resources/views/article/list.html.twig #}
    {% extends 'layout.html.twig' %}
     
    {% block body %}
        <h1>Recent Articles<h1>
     
        {% for article in articles %}
            {{ include('article/article_details.html.twig', { 'article': article }) }}
        {% endfor %}
    {% endblock %

    使用include 包含这个模板进来,路径规则和之前的相似,同样如果需要传入参数的话,{}括起来就行,和数组方式差不多

    如果要使用twig跳转到另一个界面的话,使用path函数即可,比如现在有一个路由article,slug为传入的参数

    /**
         * @Route("/article/{slug}", name="article_show")
         */

    跳转时,使用{{ path('路由名称',{参数列表来实现}) }}  ,注意你可以写死他们的url,但是使用路由名更为灵活

    {% for article in articles %}
        <a href="{{ path('article_show', {'slug': article.slug}) }}">
            {{ article.title }}
        </a>
    {% endfor %}

    对于输出图片的说明

    使用asset进行载入,这里的rel参数规定了指定link和当前链接的关系,具体看文档,这里的文档路径是相对于主机路径的即web目录路径,一般都会存放在web/bundles/scourgenWeb/css/js/png.......

    <img src="{{ asset('images/logo.png') }}" alt="Symfony!" />
     
    <link href="{{ asset('css/blog.css') }}" rel="stylesheet" />

     

    最后再对twig模板当中访问一个用户的各种信息的方式

    symfony在php,twig引擎当中默认设置一个全局变量APP,可以通过它来访问一个user的信息,这个user可以是一个UserInteface对象,有ToString() 方法的对象,或者常规字符串

    app.user   

    app.session  当前用户的session,

    app.request  当前请求对象,目前也不太了解

    再说明一下如何对一个控制器进行渲染,在twig之中访问该控制器时,可以获取到相应的值,比如我们在recentArticle当中,用render方法返回文章的信息,注意这里render的第一个参数是需要渲染的twig模板的路径(相对于views目录)

    // src/AppBundle/Controller/ArticleController.php
    namespace AppBundleController;
     
    // ...
     
    class ArticleController extends Controller
    {
        public function recentArticlesAction($max = 3)
        {
            // make a database call or other logic
            // to get the "$max" most recent articles
            $articles = ...;
     
            return $this->render(
                'article/recent_list.html.twig',
                array('articles' => $articles)
            );
        }
    }

    在twig当中访问这个Action时,直接使用article变量就行了

    {# app/Resources/views/article/recent_list.html.twig #}
    {% for article in articles %}
        <a href="/article/{{ article.slug }}">
            {{ article.title }}
        </a>
    {% endfor %}

     twig使用某个js/css文件,{{ assert('文件名') }}

     

  • 相关阅读:
    UVA 11488 Hyper Prefix Sets (字典树)
    UVALive 3295 Counting Triangles
    POJ 2752 Seek the Name, Seek the Fame (KMP)
    UVA 11584 Partitioning by Palindromes (字符串区间dp)
    UVA 11100 The Trip, 2007 (贪心)
    JXNU暑期选拔赛
    计蒜客---N的-2进制表示
    计蒜客---线段的总长
    计蒜客---最大质因数
    JustOj 2009: P1016 (dp)
  • 原文地址:https://www.cnblogs.com/eenio/p/10543361.html
Copyright © 2011-2022 走看看