角-js $ http.post在Django不工作

Question

我刚开始Django和我试图实现$ http.post角法形成数据发布到我的Django的数据库，我的进一步计划是更新视图显示结果没有页面refresh.so我想在django数据库中发布数据，然后我的视图函数将返回一个jsonresponse，发布的数据，我可以使用$ http.get方法更新视图。

但问题是我存在的就是每当我张贴的数据是无法发布数据并返回一个空的JSON响应。

这里是我的代码，我很努力： -

urls.py

from django.conf.urls import url 
from . import views 
app_name='demo' 
urlpatterns=[ 
    url(r'^$',views.index,name="index"), 
    url(r'^add_card/$',views.add_card,name="add_card") 

] 

views.py

from django.shortcuts import render 
from django.http import HttpResponse,JsonResponse 
from .forms import CardForm 
from .models import Card 
# Create your views here. 

def add_card(request): 
    saved = False 
    if request.method == 'POST': 
     #print('hi') 
     form = CardForm(request.POST) 
     #print('hi') 
     if form.is_valid(): 
      #print('hi') 
      card = Card() 
      #print('hi') 
      card.content = form.cleaned_data['content'] 
      #print('hi') 
      saved = True 
      card.save() 
      #print('hi') 
     return JsonResponse({'body':list(q.content for q in Card.objects.order_by('-id')[:15])}) 

    else: 
     return HttpResponse(
      json.dumps({"nothing to see": "this isn't happening"}), 
      content_type="application/json" 
     ) 

def index(request): 
    return render(request,'demo/index.html',{'form':CardForm()}) 

controller.js

var nameSpace = angular.module("ajax", ['ngCookies']); 

nameSpace.controller("MyFormCtrl", ['$scope', '$http', '$cookies', 
function ($scope, $http, $cookies) { 
    $http.defaults.headers.post['Content-Type'] = 'application/json'; 
    // To send the csrf code. 
    $http.defaults.headers.post['X-CSRFToken'] = $cookies.get('csrftoken'); 

    // This function is called when the form is submitted. 
    $scope.submit = function ($event) { 
     // Prevent page reload. 
     $event.preventDefault(); 
     // Send the data. 
     var in_data = jQuery.param({'content': $scope.card.content,'csrfmiddlewaretoken': $cookies.csrftoken}); 
     $http.post('add_card/', in_data) 
      .then(function(json) { 
      // Reset the form in case of success. 
      console.log(json.data); 
      $scope.card = angular.copy({}); 
     }); 
    } 
}]); 

我models.py:-

from django.db import models 

# Create your models here. 
class Card(models.Model): 
    content = models.TextField() 
    date = models.DateTimeField(auto_now_add=True) 
    def __str__(self): 
     return self.content 

我forms.py-

from django import forms 
from .models import Card 

class CardForm(forms.ModelForm): 
    class Meta: 
     model = Card 
     fields = ['content'] 

Answer 1

您的view.py代码一些问题。

1. 您需要从请求数据

2. 您需要作为响应返回新的数据在数据库中创建一个新的对象

   if form.is_valid(): 
       new_content = form.cleaned_data['content'] 
       card = Card.objects.create(content=new_content) 
       return JsonResponse(
         list(Card.objects.all().order_by('-id').values('content')[:15]), 
         safe=False 
       ) 
   

   这应该返回content值的列表如果您的表单有效，请在您的Card表中按照提供的内容在该表格中创建一个新对象之后，将其中前15个对象中的所有对象删除。

3. 而且您CardForm应该被定义如下：

   class CardForm(forms.ModelForm): 
       class Meta: 
        model = Card 
        fields = ('content',) 
   

4. 最后，您$http.post调用是异步的，这意味着达到.then时，存在这样的可能性（几乎是肯定的），该发布请求尚未解决，因此您的json.data为空。为了解决这个问题：

   $http.post('add_card/', in_data) 
       .then((json) => { 
        // Reset the form in case of success. 
        console.log(json.data); 
        $scope.card = angular.copy({}); 
   }); 
   

   一个更好的阅读和对异步到同步调用的解决方案是：ES6 Promises - Calling synchronous functions within promise chain，How do you synchronously resolve a chain of es6 promises?和Synchronous or Sequential fetch in Service Worker

祝你好运:)