ng-init 在从 Django 收到的数据中发现 u' 时会给出解析错误

Question

我正在将一些数据从 Django 后端发送到模板，我在模板中使用 Angular 和 ng-repeat 和 ng-init 循环遍历数据并将其打印在屏幕上。

这就是我使用 Python2 和 Django 在后端获取数据的方式：

country = "Global"
songs = []

for pl in pls:
    song_dict  = {}
    song_dict['title'] = pl.songs.title
    # other fields...
    songs.append(song_dict)

context = {}
context['country'] = country
context['songs'] = songs

return render(request, 'spotify_list/index.html', context)

在模板中，我尝试这样 ng-init 以访问从 Django 接收的数据：

<div ng-app="instantSearch" ng-init="items={{songs}}">

但看起来 ng-init 不喜欢每个键和值 ({u'title':u'Test1'}, {u'title':u'Test2'}) 之前的 u'。这是我得到的错误：

Error: [$parse:syntax] http://errors.angularjs.org/1.4.9/$parse/syntax?p0='title'&p1=is%20unexpected%2C%20expecting%20%5B%3A%5D&p2=10&p3=items%3D%5B%7Bu'title'%3Au'Prueba1'%7D%2C%20%7Bu'title'%3Au'Prueba2'%7D%2C%20%7Bu'title'%3Au'Prueba3'%7D%5D&p4='title'%3Au'Prueba1'%7D%2C%20%7Bu'title'%3Au'Prueba2'%7D%2C%20%7Bu'title'%3Au'Prueba3'%7D%5D
    at Error (native)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:6:416
    at Object.s.throwError (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:213:32)
    at Object.s.consume (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:213:207)
    at Object.s.object (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:212:370)
    at Object.s.primary (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:209:335)
    at Object.s.unary (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:209:174)
    at Object.s.multiplicative (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:208:434)
    at Object.s.additive (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:208:261)
    at Object.s.relational (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js:208:96) <div ng-app="instantSearch" ng-init="items=[{u'title':u'Prueba1'}, {u'title':u'Prueba2'}, {u'title':u'Prueba3'}]" class="ng-scope">

我知道如果我能从数据中删除 u'，它会很好用。像这样：

<div ng-app="instantSearch" ng-init="items=[{'title':'Prueba1'}, {'title':'Prueba2'}, {'title':'Prueba3'}]">

所以我的问题是解决这个问题的最佳方法是什么？

我应该在 Django 端以不同方式处理数据吗？怎么样？

我应该在前端以不同方式处理数据吗？怎么样？

如有任何帮助，我们将不胜感激。

Answer 1

u是python指定数据类型unicode的方式。解决方案可能是将您的数据转储为 json.

例如

<div ng-app="instantSearch" ng-init="items={{songs | json}}">

然后你只需要 define and register 在 django 端使用 json.dumps 将数据转储到 json 的过滤器。如果我正确阅读文档，它看起来像：

from django import template
import json
register = template.Library()
register.filter('json', json.dumps)

ng-init 在从 Django 收到的数据中发现 u' 时会给出解析错误

ng-init gives parse error when it finds u' in data received from Django

python

django

unicode

angularjs

angularjs-ng-init