Question

我收到了一个错误：

TemplateSyntaxError at /accounts/profile/
<ExtendsNode: extends "registration/accounts/base.html"> must be the first tag in the template

我写了base.html：

{% load staticfiles %}
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="{% load staticfiles 'bootflat/css/bootflat.min.css' %}">
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  </head>
  <body>
    <nav class="navbar navbar-default" role="navigation">
        <div class="navbar-header">
            <p class="navbar-text">HELLO</p>
            {% if user.is_authenticated %}
            <p class="navbar-text">{{  user.get_username }}</p>
            {% endif %}
        </div>
    </nav>

    <div class="container">
      {% block content %}
      {% endblock %}
    </div>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
  </body>
</html>

profile.html是：

{% load staticfiles %}
{% extends "registration/accounts/base.html" %}
{% block content %}
  <html lang="ja">
    <head>
      <meta charset="utf-8">
      <link rel="stylesheet" href="{% static 'bootflat/css/bootflat.min.css' %}">
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    </head>
    <body>

　　<a href="{% url 'kenshinresults'%}">SEE YOUR PHOTO</a>

    <div class="container">
      <form action="{% url 'accounts:upload_save' %}" method="POST" enctype="multipart/form-data">
        {% csrf_token %}
        <p>SEND PHOTO</p>
        <input type="file" name="files[]" multiple>
        <input type="hidden" value="{{ p_id }}" name="p_id">
        <input type="submit" value="Upload">
      </form>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    </body>
  </html>

{% endblock %}

我发现只有base.html被正确显示，但当我尝试base.html继承profile.html时，会发生此错误。之前，这两个文件已准确加载，但当我将href="{% static 'bootflat/css/bootflat.min.css' %}"添加到profile.html时，此错误就会让您感到愉快。为什么会发生这样的错误？我怎样才能解决这个问题？我认为添加{％load staticfiles％}对profile.html是正确的，但是它错了吗？

Answer 1

您应该将base.html文件视为布局，将profile.html视为在此布局中呈现的模板文件。

出于这个原因：

load staticfiles块应该插入base.html，并且应该插入到每个加载静态资产的文件中（参见下一个要点）
当您在src=中引用静态资产时，只需使用static路径助手加载
profile.html应扩展布局base.html，{% block content %}中包含的内容将在您身体的块内容标记内呈现

base.html文件

<html lang="ja">
  <head>
    <meta charset="utf-8">
    {% load staticfiles %}
    <link rel="stylesheet" href="{% static 'bootflat/css/bootflat.min.css' %}">
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>

  </head>
  <body>
  {% block content %} 
  <!-- your body is fine -->
  {% end block %}
  </body>
</html>

profile.html

{% extends "registration/accounts/base.html" %}

{% block content %}
    <a href="{% url 'kenshinresults'%}">SEE YOUR PHOTO</a>
    <form action="{% url 'accounts:upload_save' %}" method="POST" enctype="multipart/form-data">
        {% csrf_token %}
        <p>SEND PHOTO</p>
        <input type="file" name="files[]" multiple>
        <input type="hidden" value="{{ p_id }}" name="p_id">
        <input type="submit" value="Upload">
    </form>  
{% endblock %}

修改正如Daniel Roseman所说的

Answer 2

错误表明您必须先在模板中编写extends标记。您可以在arr file

中详细了解相关信息

因此，您应该先在{% extends "registration/accounts/base.html" %}

中写下profile.html

{% extends "registration/accounts/base.html" %}
{% load staticfiles %}
{% block content %}
  ...
{% endblock %}

之后一切都会好起来的！

/ accounts / profile /中的TemplateSyntaxError

2 个答案: