闲话少叙进入正题:今天和大家分享一个有关模板继承与模板布局的使用分享:
设计思路:在View下创建Layout文件夹,创建Basic.html基础模板文件;homeLayoutName2.html文件继承Basic文件作为一个模板布局文件。在View下IndexController下创建Fun Index
使用Layout标签使用homeLayoutName2文件作为布局文件。
结果失败。
项目目录,前期已经通过测试。解决了引用路径问题。
通过Index1文件,直接使用某个模板布局,该模板布局未继承模板
该文件使用homeLayoutName2.html布局,homeLayoutName2.html继承了homeLayoutBasic.html文件(所有的JS文件均在homeLayoutBasic文件中)。通过研读官方手册,结合个人理解。模板继承可能不能传递,及图2中使用某个模板布局(文件A)文件继承某个模板(文件B),在某个前台文件通过layout使用文件A进行布局显示。在文件A中的Extend标间没有被解析。貌似模板继承无法向实现多级,即孙子无法使用爷爷的东西。
此番言论纯属个人之言,如有不妥还请各位积极指出。如有好的模板继承或模板布局的使用方法,还请不吝赐教。
补充代码如下:
basichtml:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<block name="headTitle"><title></title></block>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- basic styles -->
<link href="__PUBLIC__/assets/css/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" href="__PUBLIC__/assets/css/font-awesome.min.css" />
<!--[if IE 7]>
<link rel="stylesheet" href="__PUBLIC__/assets/css/font-awesome-ie7.min.css" />
<![endif]-->
<!-- page specific plugin styles -->
<!-- fonts -->
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,300" />
<!-- ace styles -->
<link rel="stylesheet" href="__PUBLIC__/assets/css/ace.min.css" />
<link rel="stylesheet" href="__PUBLIC__/assets/css/ace-rtl.min.css" />
<link rel="stylesheet" href="__PUBLIC__/assets/css/ace-skins.min.css" />
<!--[if lte IE 8]>
<link rel="stylesheet" href="__PUBLIC__/assets/css/ace-ie.min.css" />
<![endif]-->
<!-- inline styles related to this page -->
<!-- ace settings handler -->
<script src="__PUBLIC__/assets/js/ace-extra.min.js"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="__PUBLIC__/assets/js/html5shiv.js"></script>
<script src="__PUBLIC__/assets/js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<block name="menu">导航</block>
<block name="content">内容</block>
<block name="temp">temp Content</block>
<!-- basic scripts -->
<!--[if !IE]> -->
<script src="__PUBLIC__/assets/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<!-- <![endif]-->
<!--[if IE]>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<![endif]-->
<!--[if !IE]> -->
<script type="text/javascript">
window.jQuery || document.write("<script src='__PUBLIC__/assets/js/jquery-2.0.3.min.js'>"+"<"+"script>");
</script>
<!-- <![endif]-->
<!--[if IE]>
<script type="text/javascript">
window.jQuery || document.write("<script src='__PUBLIC__/assets/js/jquery-1.10.2.min.js'>"+"<"+"script>");
</script>
<![endif]-->
<!--<script type="text/javascript">
if("ontouchend" in document) document.write("<script src='__PUBLIC__/assets/js/jquery.mobile.custom.min.js'>"+"<"+"script>");
</script>-->
<script src="__PUBLIC__/assets/js/bootstrap.min.js"></script>
<script src="__PUBLIC__/assets/js/typeahead-bs2.min.js"></script>
<!-- page specific plugin scripts -->
<!--[if lte IE 8]>
<script src="__PUBLIC__/assets/js/excanvas.min.js"></script>
<![endif]-->
<script src="__PUBLIC__/assets/js/jquery-ui-1.10.3.custom.min.js"></script>
<script src="__PUBLIC__/assets/js/jquery.ui.touch-punch.min.js"></script>
<script src="__PUBLIC__/assets/js/jquery.slimscroll.min.js"></script>
<script src="__PUBLIC__/assets/js/jquery.easy-pie-chart.min.js"></script>
<script src="__PUBLIC__/assets/js/jquery.sparkline.min.js"></script>
<script src="__PUBLIC__/assets/js/flot/jquery.flot.min.js"></script>
<script src="__PUBLIC__/assets/js/flot/jquery.flot.pie.min.js"></script>
<script src="__PUBLIC__/assets/js/flot/jquery.flot.resize.min.js"></script>
<!-- ace scripts -->
<script src="__PUBLIC__/assets/js/ace-elements.min.js"></script>
<script src="__PUBLIC__/assets/js/ace.min.js"></script>
<!-- inline scripts related to this page -->
</body>
</html>homelayoutName2 :<extend name="Layout:homeLayoutBasic"/>
<block name="headTitle"><title>this is homeLayoutName2 page</title></block>
<include file="Layout:homeMenu"/>
<block name="content">
{__CONTENT__}
</block>Index/index 文件:<layout name="Layout/homeLayoutName1" />
<p>这是home index page 页面的内容</p> 最佳答案