Question

我创建了一个过滤的搜索列表，用于搜索数据库中的某些项目并在列表视图中显示它们。我想要做的是将项目显示为其详细信息页面的链接。因为我正在使用django和AngularJS，所以两者之间的{{}}之间存在冲突，所以我编写了以下代码：

myApp.config(function($interpolateProvider) {
                   $interpolateProvider.startSymbol('//');
                  $interpolateProvider.endSymbol('//');
        });

但是当我尝试将点击的项目的ID传递给网址时，它不再起作用了。我试图像使用AngularJS之前那样做，但是我收到以下错误：

使用参数'（''，）'和关键字参数'{}'找不到'line_details'的反转。尝试了1种模式：['baierlab / lines / line /（？P [0-9] +）/ details']

现在代码是这样的：

详情页面的网址：

url(r'^lines/line/(?P<line_id>[0-9]+)/details', views.line_details, name='line_details'),

在模板的头部：

<script type="text/javascript">
        var myApp = angular.module('myApp', []);

        myApp.config(function($interpolateProvider) {
                   $interpolateProvider.startSymbol('//');
                  $interpolateProvider.endSymbol('//');
        });

        myApp.controller('FilterInputCtrl', function($scope,$rootScope) {

            $scope.items1 = [];

            {% for line in lines %}

                 $scope.items1.push
                 ({
                    id:{{ line.id }},
                    name:'{{ line.name }}',
                 });

            {% endfor %}
        });
    </script>

在身体：

<body>

    <div id="selection_list" class="container item_padding">

        <div ng-controller="FilterInputCtrl" >

            <div class="row">
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <input class="form-control" type="text" ng-model="item1" placeholder="Enter your item">
                    <br />
                    <ul class="list">

                        <li ng-repeat="x  in items1 | filter:item1 | orderBy:'name'">
                            <a href="{% url 'line_details' x.id %}">//x.name//</a>

                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</body>

Answer 1

你得到的错误非常自然。语句{% url 'line_details' x.id %}正在服务器级进行处理，远远超出客户端角度的角度。

这在初学者网站开发中经常是一种误解。你需要明确区分django和angular的逻辑。前者使您的服务器中发生的事情发生。它为客户端（浏览器）准备了一个响应，其中角度激发并“编译”（如角度喜欢命名）。

我个人以下列方式解决这个问题：

在Django模板中，我有一个特定的<script>部分，用于定义服务器为angular准备的js选项，包括要使用的任何URL：

<script>
    var o = {
        url: '{% url 'line_details' %}',
        // ...
    };
</script>

另请注意，您需要使用http get删除网址中的参数，例如：lines/line/details?id=x。稍后使用$http对象更容易在角度中进行操作。

然后，您需要在控制器中构建您的网址并将其绑定到<a>链接中。

当然上述方法并不是唯一的方法，并且某些要求很复杂，但是你会得到一般的想法。

在symmary中，将django逻辑与角度逻辑分开，更容易调试和开发。

从django url

1 个答案: