Angular 和 django 无法加载 ng-bind

Angular and django unable to load ng-bind

本文关键字:加载 ng-bind django Angular      更新时间:2023-09-26

我有一个简单的角度文件由django提供。我无法绑定角度views.py

def home (request):
    return render(request,'index.html',{})

索引.html

{% load staticfiles %}
<!DOCTYPE html>
<html>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <body>
        <div ng-app="">
            <p>Input something in the input box:</p>
            <p>Name : <input type="text" ng-model="name" placeholder="Enter name here"></p>
            <h1>Hello {{name}}</h1>
        </div>
    </body>
</html>

虽然这很简单。 我的ng-model="name"不与Hello {{name}}绑定

如果我加载我的索引.html单独作为一个独立的 html 文件,它可以工作,但不能使用 django

对此有任何帮助,为什么会发生这种情况?

提前致谢

那是因为你的html文件在Django的范围内。要停用 Django 对 html 的一部分的作用域,请使用 {% verbatim %}{% endverbatim %}

{% verbatim %}
    <p>Input something in the input box:</p>
    <p>Name : <input type="text" ng-model="name" placeholder="Enter name here"></p>
    <h1>Hello {{name}}</h1>
{% endverbatim %}

只需强制角度使用不同的大括号来表示角度表达式。

.config(function ($interpolateProvider) {
    $interpolateProvider.startSymbol('{[');
    $interpolateProvider.endSymbol(']}');
});

你的html代码应该是,

<p>Input something in the input box:</p>
<p>Name : <input type="text" ng-model="name" placeholder="Enter name here"></p>
<h1>Hello {[name]}</h1>

如果你这样做,你不需要一直添加逐字标签来停用 django 的范围。