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" hreftarget=%2F%%2Fbootstrap%2F3.3.5%2Fcss%2Fbootstrap.min.css">
<!-- 可选的Bootstrap主题文件(一般不用引入) -->
<link rel="stylesheet" href2F%%2Fbootstrap%2F3.3.5%2Fcss%2Fbootstrap-theme.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="///jquery/1.11.3/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="///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 hreft=%22+style%3D"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 hreftml?target=%7B%7B+path%28'blog_list') }}'>{{ cont['text'] }}</a>
blog_list
为router.yml里边配置的路由名称
关于Twig的详细使用可参考
Twig, 灵活、快速、安全的PHP模板语言
教你成为全栈工程师(Full Stack Developer) 九-让模板文件帮你快速开发网页