Question

这可能是一个简单的答案，但我无法在任何地方找到它。我的数据库中有测试数据。如何使用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)

serializers.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')

main 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>

Answer 1

请查看以下链接并按照教程轻松了解如何使用带有角度js的rest api。

1 == http://www.django-rest-framework.org/topics/third-party-resources/ 2 == http://blog.kevinastone.com/getting-started-with-django-rest-framework-and-angularjs.html

3 == http://www.youtube.com/watch?v=q8frbgtj020

如何集成django rest-framework和angularjs？

1 个答案: