Question

我4天前开始使用AngularJS，这个问题已经多次回答，但是我无法解决我的问题，在这里我们的代码

userType.html

<div ng-controller="formuserTypesController">
        User Type: <input type="text" ng-model="title" style="margin-bottom: 10px;"><br/>
        Description: <input type="text" ng-model="description" style="margin-bottom: 10px;"><br/>
        <button ng-keyup="add($event)" style="margin-bottom: 10px;">Submit Form</button>

        <h3>{{answer}}</h3>   
        <h3>{{displayres}}</h3>
        <br/>   
</div>

<div ng-controller="userTypesController">
    <!--div data-ng-repeat="ut in usertypes|limitTo:10 "-->
    <div data-ng-repeat="ut in usertypes ">
        <b>ID:</b> {{ ut.id }}<br/>
        <b>User Type:</b> {{ ut.usertype_title }}<br/>
        <b>Description: </b> {{ ut.usertype_desc }}<br/><br/>
    </div>
    <br/>
</div>

和controller.js

eventsApp.controller('formuserTypesController', ['$scope', '$routeParams', 
    function($scope, $routeParams, $http) {
        $scope.title = '';
        $scope.description = '';
        $scope.add = function( event ) {
            if( event.keyCode == 13 ) {
                $scope.answer = 'Posting data . . .';
                //$http.defaults.headers.post["Content-Type"] = "application/json";
                $http({
                    method: 'POST',
                    url: '/developer/user_type/',
                    dataType: 'json',
                    data: { usertype_title: $scope.title, usertype_desc: $scope.description },              
                    headers: { 'Content-Type': 'application/json; charset=UTF-8' },
                    }).
                    success(function(data, status, headers, config) {
                        $scope.displayres = data
                        $scope.answer = 'Data has been successfully posted.';
                        //console.log(data);
                    }).
                    error(function(data, status, headers, config) {
                        $scope.displayres = data
                        $scope.answer = 'Posting data was unsuccessful.';
                        //console.log(data);
                      });                                       
            }
        }       
}]);

我无法使用stackoverflow上提供的任何解决方案，任何帮助将不胜感激

控制台

Quit the server with CTRL-BREAK.
[08/Dec/2014 15:58:00] "GET / HTTP/1.1" 200 1265
[08/Dec/2014 15:58:01] "GET /static/js/controllers.js HTTP/1.1" 200 2541
[08/Dec/2014 15:58:01] "GET /static/js/partials/userType.html HTTP/1.1" 304 0
[08/Dec/2014 15:58:01] "GET /developer/user_type/?format=json HTTP/1.1" 200 210
[08/Dec/2014 16:00:02] "GET /developer/user_type/ HTTP/1.1" 200 11576
[08/Dec/2014 16:36:33] "GET / HTTP/1.1" 200 1265
[08/Dec/2014 16:36:33] "GET /static/js/app.js HTTP/1.1" 304 0
[08/Dec/2014 16:36:33] "GET /static/js/controllers.js HTTP/1.1" 304 0
[08/Dec/2014 16:36:33] "GET /static/js/partials/userType.html HTTP/1.1" 200 688
[08/Dec/2014 16:36:33] "GET /developer/user_type/?format=json HTTP/1.1" 200 210

Answer 1

由于CORS的限制。

见：

Answer 2

controller.js 中的

更改这两行

eventsApp.controller('formuserTypesController', ['$scope', '$routeParams', 
    function($scope, $routeParams, $http) {

到

eventsApp.controller('formloginController', function($scope, $http) {

以及在webservice中添加csrftoken ，解决了我的问题。

views.py

中的

from django.core.context_processors import csrf

def index(request):
    c = {}
    c.update(csrf(request))
    return render_to_response('index.html', c)

AngularJS HTTP post方法不适用于在localhost上运行的Web服务

2 个答案: