如何使用angularjs，Django，Django休息框架更新模型

I have such json representation of a post by its id:

我的id有这样一个帖子的json表示:

http://127.0.0.1:8000/update/1?format=json
{"title": "about me", "content": "I like program", "created":    "2014-11-29T18:07:18.173Z",   "rating": 1, "id": 1}

I try to update rating by button click:

我尝试通过按钮点击更新评级:

 <button ng-click="click(post.id)">Click me</button>

I have such javascript code:

我有这样的javascript代码:

<script>
var demoApp = angular.module('demoApp',['ngResource']);
    demoApp.controller( 'AllPosts', function ($scope, $http)
    {
    $http.get('/blogpost/?format=json').success(function(data,status,headers,config)
    {
    $scope.posts = data.results; 
    $scope.predicate = '-title';

      $scope.click = function(post_id, $resource){
       var Post = $resource('/update/:PostId ',{PostId:post_id,format:'json'} );  
       post = Post.get({PostId:post_id}, function() {
       post.rating = post.rating+ 1 ;
       post.$save();
       });
       };

 }).error(function(data,status,headers,config)
     {} )
    ;})

 </script>

Peharps i have mistake because in json i have a single object. But i dont really know

Peharps我有错误,因为在json我有一个单一的对象。但我真的不知道

Besides i have such view to have a json by certain post by its id:

此外,我有这样的观点,通过其id的某个帖子有一个json:

class UpdateModel(generics.RetrieveUpdateDestroyAPIView):
      lookup_field = 'id'
      queryset = BlogPost.objects.all()
      serializer_class = BlogPostSerializer
      permission_classes = (AllowAny,)

1 个解决方案

#1

A quick tidy up of your script tag shows that you are only defining the function click if the http call was successful.

快速整理脚本标记表明,如果http调用成功,您只定义了函数click。

I would suggest moving the definition of the click method outside of the success callback.

我建议在成功回调之外移动click方法的定义。

You may also be running into a race condition that the click function has not been defined before clicking the actual button. Regardless you will want to move that function definition to where the controller is actually created.

在单击实际按钮之前,您可能还遇到了未定义单击功能的竞争条件。无论您希望将该函数定义移动到实际创建控制器的位置。

Suggested edits (moved click definition outside of http call response):

建议的编辑(在http调用响应之外移动了点击定义):

var demoApp = angular.module('demoApp', ['ngResource']);
demoApp.controller('AllPosts', function($scope, $http, $resource) {
    $scope.click = function(post_id) {
        var Post = $resource('/update/:PostId ', {
            PostId: post_id,
            salutation: 'json'
        });
        post = Post.get({
            PostId: post_id
        }, function() {
            post.rating = post.rating + 1;
            post.$save();
        });
    };

    $http.get('/blogpost/?format=json').success(function(data, status, headers, config) {
        $scope.posts = data.results;
        $scope.predicate = '-title';
    }).error(function(data, status, headers, config) {});
})

Updates:

Injected $resource into the controller

将$资源注入控制器

Removed $resource from click function params

从click function params中删除了$ resource

#1