无法从Django Rest API到AngularJS获取数据

Question

我是AngularJS和Djnago Rest Framework 。 我创建了一个Web API，以JSON格式返回客户列表。 我在mozilla firefox的RESTClient插件中获取了正确的数据。 但是我无法在AngularJS脚本中获取数据。

在这里，我附上了所有代码和错误图像，如下所示：

views.py （API代码）

class CustomerListView(APIView):
    renderer_classes = (JSONRenderer, )

    def post(self, request, format=None):
        content = []
        customer_list = Customer_tbl.objects.all()
        if customer_list:
            for customer in customer_list:
                content.append({ 
                    'first_name': customer.cus_first_name,
                    'last_name': customer.cus_last_name,
                    'email': customer.cus_email,
                    'contact': customer.cus_contact
                    })
        return Response(content)

test.html

<!DOCTYPE html>
<html ng-app="myTestModule">
<head>
    <script src="../scripts/angular.js"></script>
    <script src="../scripts/sample_page_test.js"></script>
    <link href="../css/style_new.css" rel="stylesheet" />-->
</head>
<body> 
    <div ng-controller="customerController">
        <table>
            <thead>
                <tr>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Email</th>
                    <th>Contact</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="customer in customers">
                    <td>{{ customer.first_name }}</td>
                    <td>{{ customer.last_name }}</td>
                    <td>{{ customer.email }}</td>
                    <td>{{ customer.contact }}</td>
                </tr>
            </tbody>
        </table>
    </div>
    ...
    ...
    ...
</body>
</html>

sample_page_test.js

var myTestApp = angular.module("myTestModule", [])
myTestApp.controller("customerController", function ($scope, $http) {
        var url = "http://192.168.1.102:8000/stl_web_app/api/customer_list/";

        $http.post(url).then( function(response) {
           $scope.customers = response.data;
        });
});

错误图片

在Firebug控制台中出现以下错误

error.png

我需要在Django应用程序的settings.py中进行任何更改吗？

所以，有人可以帮我解决这个问题吗？

任何帮助将不胜感激。

谢谢。

Answer 1

首先，您实际上是在尝试发出POST请求吗？ 因为从外观上看，您似乎正在尝试返回客户列表。 请使用GET请求而不是POST来获取数据。

其次，如果您遇到跨域资源共享问题，请检查您是否正确传递了CSRF-TOKEN和POST请求。

views.py

class CustomerListView(APIView):
    renderer_classes = (JSONRenderer, )

    def get(self, request, format=None):
        content = []
        customer_list = Customer_tbl.objects.all()
        if customer_list:
            for customer in customer_list:
                content.append({ 
                    'first_name': customer.cus_first_name,
                    'last_name': customer.cus_last_name,
                    'email': customer.cus_email,
                    'contact': customer.cus_contact
                    })
        return Response(content)

sample_page_test.js

var myTestApp = angular.module("myTestModule", [])
myTestApp.controller("customerController", function ($scope, $http) {
var url = "http://192.168.1.102:8000/stl_web_app/api/customer_list/";

        $http.get(url).then( function(response) {
           $scope.customers = response.data;
        });
});

希望这会帮助你。

无法从Django Rest API到AngularJS获取数据

问题描述

1 个解决方案

解决方案1
0 2017-05-30 12:28:39

views.py

sample_page_test.js

无法从Django Rest API到AngularJS获取数据

问题描述

1 个解决方案

解决方案1 0 2017-05-30 12:28:39

views.py

sample_page_test.js

解决方案1
0 2017-05-30 12:28:39