在我开始之前，我必须说我最近开始学习CodeIgniter，所以如果我再次重复这个主题，我很抱歉。
在过程式php中，我会这样做
// the header.php
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="blah blah">
<title>My Site</title>
<link href="css/main.css" rel="stylesheet" media="screen">
<php? if($current_page == 'about.php'): ?>
<link href="css/secondary.css" rel="stylesheet" media="screen"> // or some embed styles (<stlye> ... </style>)
<?php endif; ?>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/main_script.js"></script>
<php? if($current_page == 'contact.php'): ?>
<script src="js/validation.js"></script>
<?php endif; ?>
</head>
<body>
// end of header.php
include('template/header.php');
<h1>Heading1</h1>
<p>Lorem Ipsum...</p>
include('template/footer.php');
//footer.php
//maybe some js and here
</body>
</html>
所以我想做一些类似的和在CI。所有的页面/视图都有相同的主样式或脚本，但在某些情况下，一些特定的页面(如contact.php)可能包括，并且在这些页面中只有，一些特定的样式或脚本(如validation.js)。
我发现这个视频显示了如何使用CI创建模板/布局库，但我不太确定如何应用此功能正常工作。
把底部类放在libraries/Layout.php中(你的应用程序不是sys)。在自动加载中添加库:
$autoload['libraries'] = array('layout');
只需在控制器中写入$this->layout->render();
类将呈现布局views/layouts/default.php和视图views/$controller.views/$method.php
在默认布局中输入
<?php $this->load->view($view,$data); ?>
就是这样。
代码
<?php
if (!defined('BASEPATH')) exit('No direct script access allowed');
class Layout
{
public $data = array();
public $view = null;
public $viewFolder = null;
public $layoutsFodler = 'layouts';
public $layout = 'default';
var $obj;
function __construct()
{
$this->obj =& get_instance();
}
function setLayout($layout)
{
$this->layout = $layout;
}
function setLayoutFolder($layoutFolder)
{
$this->layoutsFodler = $layoutFolder;
}
function render()
{
$controller = $this->obj->router->fetch_class();
$method = $this->obj->router->fetch_method();
$viewFolder = !($this->viewFolder) ? $controller.'.views' : $this->viewFolder . '.views';
$view = !($this->view) ? $method : $this->view;
$loadedData = array();
$loadedData['view'] = $viewFolder.'/'.$view;
$loadedData['data'] = $this->data;
$layoutPath = '/'.$this->layoutsFodler.'/'.$this->layout;
$this->obj->load->view($layoutPath, $loadedData);
}
}
?>
我正在做布局的事情就像下面。
I get content to data['content'] variable.
class Article extends MY_Controller {
function __construct() {
parent::__construct();
$this->load->model('article_model');
}
public function index() {
$data['allArticles'] = $this->article_model->getAll();
$data['content'] = $this->load->view('article', $data, true);
$this->load->view('layout', $data);
}
这是我的布局。我使用bootstrap布局。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Starter Template for Bootstrap</title>
<base href="<?php echo base_url(); ?>" />
<!-- Bootstrap core CSS -->
<link href="assets/bootstrap3.0.1/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<!-- <link href="starter-template.css" rel="stylesheet">-->
<!-- Just for debugging purposes. Don't actually copy this line! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"> Article Management System</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="">Home</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#"> Admin <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="article/add">Add Article</a></li>
<li><a href="article">All Article</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="container" style="margin-top: 80px;">
<?php echo $content; ?>
</div><!-- /.container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="assets/bootstrap3.0.1/js/bootstrap.min.js"></script>
</body>
</html>
这是我的内容视图
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12">
<div class="page-header">
<h4>All Articles </h4>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-12">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>Title</th>
<th>Description</th>
<th></th>
</tr>
</thead>
<tbody>
<?php foreach ($allArticles as $row) { ?>
<tr>
<td><?php echo $row->title; ?></td>
<td><?php echo substr($row->description,0,100); ?> ....</td>
<td></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</div>
我已经完成了同样的事情:
将此代码放入您的./application/core/MY_Controller.php文件:
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class MY_Controller extends CI_Controller
{
protected $layout = 'layout/main';
public function __construct()
{
parent::__construct();
}
protected function render($file = NULL, &$viewData = array(), $layoutData = array())
{
if( !is_null($file) ) {
$data['content'] = $this->load->view($file, $viewData, TRUE);
$data['layout'] = $layoutData;
$this->load->view($this->layout, $data);
} else {
$this->load->view($this->layout, $viewData);
}
$viewData = array();
}
}
在./application/views目录中创建一个布局文件夹，然后在其中创建包含整个html的文件。只需将<?php echo $content; ?>放入要将动态内容放入其中的文件中。然后在控制器中使用$this->render();并传递文件路径和数据。如果你想为特定的页面使用不同的布局，只需把$this->layout = 'path_to_your_layout_file';，它将覆盖布局文件使用
不久前我也遇到过类似的问题。我的解决方案如下:在控制器构造函数中创建两个数组，一个是css文件，一个是js文件，并将所有视图的通用文件放入其中。在控制器的每个函数中添加特定的逻辑文件。对于您的示例，您将有这样的内容:
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Home extends CI_Controller
{
public function __construct()
{
parent::__construct();
$this->page_data = array();
$this->page_data['css']=array('main.css','bootstrap.css');
$this->page_data['js']=array('main.js','bootstrap.js');
}
public function about()
{
array_push($this->page_data['css'],'secondary.css');
$this->load->view('main_layout',$this->page_data)
}
public function contact()
{}
}
在你的视图文件中，你只需要遍历$css和$js数组并逐一包含它们。通过将页眉和页脚模板压入page_data数组，您可以轻松地对其进行扩展，以包含它们。
我最终切换到使用Backbone在客户端做所有的模板，并使用Code Igniter作为一个REST API，但这种技术给了我相对干净的代码，我需要的
5个简单步骤创建CodeIgniter模板:
<标题> 1步h1> emplate.php @ libraries <标题>第二步h1> 下面的代码/* Start of file Template.php */
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Template {
var $template_data = array();
function set($name, $value)
{
$this->template_data[$name] = $value;
}
function load($template = '', $view = '' , $view_data = array(), $return = FALSE)
{
$this->CI =& get_instance();
$this->set('contents', $this->CI->load->view($view, $view_data, TRUE));
return $this->CI->load->view($template, $this->template_data, $return);
}
}
/* End of file Template.php */
/* Location: ./system/application/libraries/Template.php */
配置/autoload.php开放在第55行替换
$autoload['libraries'] = array('database', 'session','encrypt');
with this code
$autoload['libraries'] = array('database', 'session','encrypt', 'template');
//start
$this->template->load(TEMPLATE_NAME, VIEW_NAME , $this->data);
//end
//start
<?php $this->load->view('elements/header'); ?>
<div><?php echo $contents;?></div>
<?php $this->load->view('elements/footer'); ?>
//end
注意:在views中的elements文件夹中创建两个文件:header.php和footer.php
我在旧版本的CodeIgniter中使用这个，它也适用于版本3。
<?php
if (!defined('BASEPATH')) exit('No direct script access allowed');
class Layout
{
var $obj;
var $layout;
function Layout($layout = "layout_main")
{
$this->obj =& get_instance();
$this->layout = $layout;
}
function setLayout($layout)
{
$this->layout = $layout;
}
function view($view, $data=null, $return=false)
{
$loadedData = array();
$loadedData['content_for_layout'] = $this->obj->load->view($view,$data,true);
if($return)
{
$output = $this->obj->load->view($this->layout, $loadedData, true);
return $output;
}
else
{
$this->obj->load->view($this->layout, $loadedData, false);
}
}
}
?>
在控制器中调用它，我使用:
$this->layout->view('apps/apps', $data);