将 Django 模板继承与 ngroute 一起使用 - 如果我想覆盖 `
` 之外的块,`
` 会去哪里?

2023-12-24

这是我的base.html:

<!DOCTYPE html>

<html{% block html %}{% endblock%}>
    {% load static from staticfiles %}
    <head>
    <meta charset="utf-8">
    <title>{% block title %}Base{% endblock %}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="{% static 'js/jquery-1.11.3.min.js' %}"></script>
    <script src="{% static 'js/angular.js' %}"></script>
    <script src="{% static 'js/angular-route.js' %}"></script>
    <base href="/">
    {% block head %}{% endblock %}
    </head>


    <noscript> <!-- If JS is disabled, the CSS below will run, causing everything inside "bodyContainer"
                to no appear and causing the "noscriptmsg" to appear. -->
        <style type="text/css">
            .bodyContainer {display:none;}
            .noscriptmsg {display: block;}
        </style>
    </noscript>
    <div class="noscriptmsg">
        <p>Please enable your browser's JavaScript in order to view this website.</p>
    </div>

    {% block body %}
        <span class='cerrorMessage' ng-bind="ctrl.cerrorMessages"></span>
    {% endblock %}
</html>

这是继承的模板的示例base.html(叫它home.html):

{% extends "base.html" %}

{% load static from staticfiles %}

{% block html %} ng-app="AuthenticationApp"{% endblock %}

{% block head %}
    <link rel="stylesheet" type="text/css" href="{% static 'css/home.css' %}">
    <script src="{% static 'js/home.js' %}"></script>
{% endblock %}

{% block body %}

<body ng-controller="MainCtrl as ctrl" class="bodyContainer">
    <div class="container">
        <div class="row">
            {{ block.super }}
        </div>
        <div class="row">
            <form ng-submit="ctrl.change()" class="form-horizontal" name="myForm"></form>
        </div>
    </div>

</body>

{% endblock %}

The html块是设置ng-app将用于网页。这headblock是加载相关的JS和CSS文件。这bodyblock 是 HTML 页面主体所在的位置。但是,我正在使用ngroute加载网页。这是路由和JS:

.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/new', {
    templateUrl: 'static/templates/new.html'
})

self.change = function() {
    $location.url("/new");
};

So in home.html,提交表单后,URL 更改为/new(其服务于页面new.html。这是new.html:

{% block html %} ng-app="NewApp"{% endblock %}

{% body head %}
    <link rel="stylesheet" type="text/css" href="{% static 'css/new.css' %}">
{% endblock %}

{% body block %}
    <h5>NEW CONTENT</h5>
{% endblock %}

所以对于每个继承的模板base.html并被加载,我希望能够再次重新定义/覆盖块。我该放在哪里<div ng-view></div>这样我就能够用正确的代码结构重新定义块?

我试着把它放进去home.html(应用程序首先加载的页面)就在下面<div class="container"></div>,但它不会覆盖这些块。我可以把它放进去base.html上面/外面<html{% block html %}{% endblock %}>,但这将放置一个<div>在外面<html>这不是正确的代码结构。知道如何做到这一点吗?


None

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将 Django 模板继承与 ngroute 一起使用 - 如果我想覆盖 `
` 之外的块,`
` 会去哪里? 的相关文章

随机推荐