symfony入门学习资料之十三：symfony框架Twig模板语言的使用

最新推荐文章于 2020-08-06 04:00:09 发布

jyl_sh

最新推荐文章于 2020-08-06 04:00:09 发布

阅读量1k

点赞数 1

分类专栏： Symfony TP5 Edusoho 文章标签： php html5 html https http

本文链接：https://blog.csdn.net/jyl_sh/article/details/106747156

版权

Symfony 同时被 3 个专栏收录

69 篇文章 5 订阅

订阅专栏

TP5

69 篇文章 0 订阅

订阅专栏

Edusoho

59 篇文章 6 订阅

订阅专栏

symfony入门学习资料之十三：symfony框架Twig模板语言的使用

php的Twig模板语言：类似python的jinja2，语法什么的都是类似python

一、模板继承

模板路径：app/Resources/views/

母版：base.html.twig

<!DOCTYPE html>
<html lang="zh-CN">
<head>
   <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
     <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
     <title>{% block title %}自定义标题{% endblock title %}</title>
     <!-- 新 Bootstrap 核心 CSS 文件 -->
     <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
     <!-- 可选的Bootstrap主题文件（一般不用引入） -->
     <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
     <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
     <script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
     <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
     <script src="https://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
   </head>
   <body>
      <div class="row bg-primary"> 
         <div class="col-sm-1 col-xs-1"></div> 
         <div class="col-sm-11 col-xs-11">
             <h1>
                <a href="" style="text-decoration: none;color: white;">MyWebSite</a>
             </h1>
          </div>
       </div>
       {% block body %}
       {% endblock body %}
    </body>
</html>

实际使用的模板：列表模板list.html.twig

{% extends "base.html.twig" %}
{% block title %}MyWebSite{% endblock title %}
{% block body %}
     <div class="row jumbotron"> 
         <div class="col-md-1 col-xs-1"></div> 
         <div class="col-md-10 col-xs-10">
            <h1>Welcome to MyWebSite!</h1>
         </div> 
         <div class="col-md-1 col-xs-1"></div>
       </div>
{% endblock body %}

实际使用的模板：内容模板show.html.twig

{% extends "base.html.twig" %}
{% block title %}博客内容{% endblock title %}
{% block body %}
     <div class="row jumbotron"> 
        <div class="col-md-1 col-xs-1"></div> 
        <div class="col-md-10 col-xs-10">
            <h1>我的第一篇博客</h1>
        </div> 
        <div class="col-md-1 col-xs-1"></div>
     </div>
{% endblock body %}

list.html.twig 和 show.html.twig 都继承了 base.html.twig，拥有了相同的页面布局

二、变量传递

文件路径：src/AppBundle/Controller/BlogController.php

return $this->render('blog/show.html.twig', array('title' => '博客标题', 'content' => '博客内容'));

修改show.html.twig中block body

<div class="row jumbotron"> 
    <div class="col-md-1 col-xs-1"></div> 
    <div class="col-md-10 col-xs-10">
        <h1>{{ title }}</h1>
    </div> 
    <div class="col-md-1 col-xs-1"></div>
</div>
<div class="row"> 
   <div class="col-md-1 col-xs-1"></div> 
   <div class="col-md-10 col-xs-10">
         <h4>{{ content }}</h4>
   </div> 
   <div class="col-md-1 col-xs-1"></div>
</div>

变量传递通过 {{ }} 这样的符号来传递

传递类型举例读取方式

变量	array(‘title’ => ‘博客标题’)	{{ title }}
array结构	array(‘content’ => $content)	{{ content[‘time’] }}
类结构	array(‘content’ => $content)	{{ content.time }}
php原生方法	去掉 html标签方法	{{ content \| strip_tags }}

三、流程控制

src/AppBundle/Controller/BlogController.php

  $content = array();  
  $content[] = array('category' => '类别1', 'text' => '内容1');  
  $content[] = array('category' => '类别2', 'text' => '内容2');  
  $content[] = array('category' => '类别1', 'text' => '内容3');  
  $content[] = array('category' => '类别2', 'text' => '内容4');  
  return $this->render('blog/show.html.twig', array('title' => '博客标题', 'content' => $content));

修改app/Resources/views/blog/show.html.twig，改成：

{% for cont in content %}
   {% if cont['category'] == '类别2' %}
     <div class="row"> 
       <div class="col-md-1 col-xs-1"></div> 
       <div class="col-md-10 col-xs-10">
           <h4>{{ cont['text'] }}</h4>
       </div> 
       <div class="col-md-1 col-xs-1"></div>
     </div>
   {% endif %}
{% endfor %}

循环遍历 : {% for cont in content %}
逻辑判断: {% if cont[‘category’] == ‘类别2’ %}

链接生成

<a href='{{ path('blog_list') }}'>{{ cont['text'] }}</a>

blog_list为router.yml里边配置的路由名称

jyl_sh

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
symfony入门学习资料之十三：symfony框架Twig模板语言的使用

symfony入门学习资料之十三：symfony框架Twig模板语言的使用php的Twig模板语言：类似python的jinja2，语法什么的都是类似python一、模板继承模板路径：app/Resources/views/母版：base.html.twig<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="utf-8"> <meta http-e...
复制链接

扫一扫