Django 和擴展模板不起作用？
[英]Django and extending templates not working?
問題描述
我正在使用 Django 構建我的博客站點，但無法在我的項目中擴展模板。
我有兩個模板：
- base.html
- post.html
Base.html 是我的父模板，post.html 是我擴展 base.html 的子模板。
我無法讓 Django 擴展 post.html。 當我運行 web 服務器 base.html 顯示但沒有來自 post.html 的文本。
我已經閱讀了關於模板和如何擴展的 Django 文檔，我相信我必須正確語法，但我不確定它為什么不起作用？
我也在這個項目中使用 Boostrap。
謝謝你的幫助，內爾敏
post.html
{% extends "post/base.html" %}
{% block content %}
<div class="blog-post">
<h2 class="blog-post-title">Sample blog post</h2>
<p class="blog-post-meta">January 1, 2014 by <a href="#">Mark</a></p>
<p>Blog text goes here.</p>
</div><!-- /.blog-post -->
{% endblock %}
在此處輸入代碼
base.html
<!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">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<!-- load static files -->
{% load staticfiles %}
<title>Blog Title</title>
<!-- Bootstrap core CSS -->
<link href="{% static 'css/bootstrap.min.css' %}" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="{% static 'css/blog.css' %}" rel="stylesheet">
<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="../../assets/js/ie-emulation-modes-warning.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="blog-masthead">
<div class="container">
<nav class="blog-nav">
<a class="blog-nav-item active" href="#">Home</a>
<a class="blog-nav-item" href="#">About</a>
</nav>
</div>
</div>
<!-- blog post goes here -->
{% block content %}
{% endblock %}
<div class="container">
<div class="blog-header">
<h1 class="blog-title">Code'N Cofee Blog</h1>
<p class="lead blog-description">Live and write code. </p>
</div>
<div class="row">
<div class="col-sm-8 blog-main">
<nav>
<ul class="pager">
<li><a href="#">Previous</a></li>
<li><a href="#">Next</a></li>
</ul>
</nav>
</div><!-- /.blog-main -->
<div class="col-sm-3 col-sm-offset-1 blog-sidebar">
<div class="sidebar-module sidebar-module-inset">
<h4>About</h4>
<p>Etiam porta <em>sem malesuada magna</em> mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.</p>
</div>
<div class="sidebar-module">
<h4>Archives</h4>
<ol class="list-unstyled">
<li><a href="#">March 2014</a></li>
<li><a href="#">February 2014</a></li>
<li><a href="#">January 2014</a></li>
<li><a href="#">December 2013</a></li>
<li><a href="#">November 2013</a></li>
<li><a href="#">October 2013</a></li>
<li><a href="#">September 2013</a></li>
<li><a href="#">August 2013</a></li>
<li><a href="#">July 2013</a></li>
<li><a href="#">June 2013</a></li>
<li><a href="#">May 2013</a></li>
<li><a href="#">April 2013</a></li>
</ol>
</div>
<div class="sidebar-module">
<h4>Elsewhere</h4>
<ol class="list-unstyled">
<li><a href="#">GitHub</a></li>
<li><a href="#">Twitter</a></li>
<li><a href="#">Facebook</a></li>
</ol>
</div>
</div><!-- /.blog-sidebar -->
</div><!-- /.row -->
</div><!-- /.container -->
<footer class="blog-footer">
<p>Blog template built for <a href="http://getbootstrap.com">Bootstrap</a> by <a href="https://twitter.com/mdo">@mdo</a>.</p>
<p>
<a href="#">Back to top</a>
</p>
</footer>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="../../dist/js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
</body>
</html>
3 個解決方案
解決方案1
1 2020-07-03 12:06:13
Nermic Kekic 的回答對我不起作用。
我不是專家，但以下是對我有用的方法。
問題是我的 base.html(parent) 不知道在哪里附加 post.html(child) 所以我不得不提到
{% block content %}
{% endblock %}
我的 base.html 正文中的這兩行也對我有用，因為此塊將告訴 post.hml 在哪里顯示 child 的內容。
解決方案2
0 2017-01-25 05:54:27
我找到了解決方案。 問題不在於兩個 html 文件，而是在我的 views.py 文件中。 基本上在我的 index 函數中，views.py 正在渲染 base.html，因此 post.html 屏幕上沒有顯示任何內容
鑒於 post.html 正在擴展 base.html，我需要編輯我的索引函數以返回和呈現 post.html，如下所示，這修復了代碼。
希望這可以幫助其他遇到類似問題的人。
這是我的索引函數現在在 views.py 中的樣子
from django.shortcuts import render
from django.http import HttpResponse
def index(request):
return render(request, 'post/post.html', {'': ''})
解決方案3
0 2021-01-02 08:32:48
{% block content %}
{% endblock content %}
您需要在base.html文件中添加以上代碼行。 在您的 (post.html) 文件中，您需要添加這些行以及其中的獨特內容。 這樣 Django 就知道您可以在何處更改 post.html 文件。
解決方案4
0 2022-07-22 17:40:27
似乎您的文件沒問題。確保在擴展其他文件之前已在視圖中返回文件
Django模板自身擴展，嘗試擴展Django管理模板時超出了最大遞歸深度
[英]Django template extending itself, maximum recursion depth exceeded when trying to extend the Django admin templates
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.