如何集成 django rest-framework 和 angularjs？答案

【问题标题】：How to integrate django rest-framework and angularjs?如何集成 django rest-framework 和 angularjs？
【发布时间】：2016-09-24 22:59:10
【问题描述】：

这可能是简单的答案，但我无法在任何地方找到它。我的数据库中有测试数据。如何使用 Angular 显示来自 django restframework api 的数据？换句话说，我将在我的角度控制器和我的 html 文件中放入什么代码？

models.py

from django.contrib.postgres.fields import JSONField
from django.db import models

class UserData(models.Model):
    """
    Requires a user id, email, first and last name.
    """
    user_id = models.CharField(max_length=75)
    email = models.EmailField()
    phone = models.CharField(max_length=10)
    name_first = models.CharField(max_length=100)
    name_last = models.CharField(max_length=100)

序列化器.py

from rest_framework import serializers
from check import models as m
from django.contrib.auth.models import User


class TestSerializer(serializers.ModelSerializer):
    class Meta:
        model = m.UserData
        fields = ('user_id', 'email', 'phone', 'name_first', 'name_last')

主 urls.py

router = routers.DefaultRouter()
router.register(r'user', json_views.TestViewSet)

    urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url('^api/', include(router.urls, namespace='api')),
    ]

views.py

class TestViewSet(viewsets.ModelViewSet):
    queryset = m.UserData.objects.all()
    serializer_class = serializers.TestSerializer
    permission_classes = (IsOwnerOrReadOnly,)

我假设这是基本思想，但我不明白如何在 api 数据和角度显示之间建立联系。

app.js

testApp = angular.module('demoapp', []); 

testApp.config(['$httpProvider', function($httpProvider){
    $httpProvider.defaults.xsrfCookieName = 'csrftoken';
    $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
}]);

<body ng-app="demoapp">
<div ng-controller="testApp">
    <ul>
        <li ng-repeat="user in data">
            [[user.user_id]] <br>
            [[user.email]]<br>
            [[user.phone]]<br>
            [[user.name_first]]<br>
            [[user.name_last]]<br>
        </li>
    </ul>
</div>

【问题讨论】：

标签： jquery angularjs ajax django django-rest-framework