时间戳

首页 > 解决方案 > 无法使用双括号解析变量

html - 无法使用双括号解析变量

问题描述

我无法使用双括号来解析变量。这是我的js代码。

var app = angular.module('toDo',[]);
app.controller('toDoController', function($scope, $http) {
$http.get('/todo/api/').then(function(response) {
    $scope.todoList = response.data;
    });
});

HTML 代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>To Do List</title>
        {% load static %}
        <link rel="stylesheet" href="{% static 'css/todo.css' %}">
    </head>
    <body ng-app="toDo" ng-controller="toDoController">
        <h1>Todo List</h1>

        <form ng-submit="add()">
            <input type="text" ng-model="todoInput" placeholder="Add a new todo task...">
            <button type="submit">Add Task</button>
        </form>
        <br>
        <div ng-repeat="todo in todoList">
            <input type="checkbox" ng-model="todo.done"><a ng-href="/todo/api/{{todo.id}}" ng-bind="todo.task"></a>
        </div>

        <p>
            <button class="delete" ng-click="delete()">Delete</button>
            <button class="update" ng-click="update()">Update</button>
        </p>

        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular.js"></script>
        <script src="{% static 'js/todo.js' %}"></script>
    </body>
</html>

屏幕上显示的任务应该将我重定向到 URL“/todo/api/”。但是大括号中给出的值不能解析它的 ID。目前超链接总是重定向到 url “/todo/api/”。

如果我做错了什么或帮助我解决此问题，请告诉我。

标签： htmlangularjsdjango

解决方案

括号由 Django 模板渲染器解释。您可以使用{% verbatim %}...{% endverbatim %} [Django-doc]来避免解释双花括号，例如：

<a {% verbatim %}ng-href="/todo/api/{{todo.id}}"{% endverbatim %} ng-bind="todo.task"></a>

推荐阅读