python - Angular 代码与我的 python django 应用程序配合不佳

Question

出于某种原因，我无法让我的 Angular 代码与我的 python django 应用程序很好地配合。当我提交页面时，它会将所有空值保存在我的数据库中，并且我的获取响应也无法正常工作，因为没有返回任何内容。任何帮助将不胜感激，我还提供了屏幕截图，以便更好地了解我正在尝试做的事情。

Angular 代码

var dim = angular.module('Dim', ['ngResource']); 


dim.config(['$httpProvider', function($httpProvider) { 
    $httpProvider.defaults.xsrfCookieName = 'csrftoken'; 
    $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken'; 
}]); 

dim.factory("Dim", function ($resource) { 
    return $resource("/_dims.html/:id", { id: '@id' }, { 
        index: { method: 'GET', isArray: true, responseType: 'json' }, 
        update: { method: 'PUT', responseType: 'json' } 
    }); 
}) 


dim.controller("DimController", function ($scope, $http, Dim) { 
    $scope.dims = Dim.index() 

    $scope.addDim = function () { 
        dim = Dim.save($scope.newDim) 

        $scope.dims.push(Dim) 
        $scope.newDim = {} 
    } 

    $scope.deleteDim = function (index) { 

        dim = $scope.dims[index] 
        Dim.delete(dim) 
        $scope.dims.splice(index, 1); 
    } 
}) 

View .py

def add_dimensions(request): 
  if request.method == 'POST': 
    c_date = datetime.now() 
    u_date = datetime.now() 
    description = request.POST.get('description') 
    style = request.POST.get('style') 
    target = request.POST.get('target') 
    upper_limit = request.POST.get('upper_limit') 
    lower_limit = request.POST.get('lower_limit') 
    inspection_tool = request.POST.get('inspection_tool') 
    critical = request.POST.get('critical') 
    units = request.POST.get('units') 
    metric = request.POST.get('metric') 
    target_strings = request.POST.get('target_strings') 
    ref_dim_id = request.POST.get('ref_dim_id') 
    nested_number = request.POST.get('nested_number') 
    met_upper = request.POST.get('met_upper') 
    met_lower = request.POST.get('met_lower') 
    valc = request.POST.get('valc') 
    sheet_id = request.POST.get('sheet_id') 
    data = {} 
    dim = Dimension.objects.create( 
          description=description, 
          style=style, 
          target=target, 
          upper_limit=upper_limit, 
          lower_limit=lower_limit, 
          inspection_tool=inspection_tool, 
          critical=critical, 
          units=units, 
          metric=metric, 
          target_strings=target_strings, 
          ref_dim_id=ref_dim_id, 
          nested_number=nested_number, 
          met_upper=met_upper, 
          met_lower=met_lower, 
          valc=valc, 
          sheet_id=sheet_id, 
          created_at=c_date, 
          updated_at=u_date) 
    data['description'] = dim.description; 
    data['style'] = dim.style; 
    data['target'] = dim.target; 
    data['upper_limit'] = dim.upper_limit; 
    data['lower_limit'] = dim.lower_limit; 
    data['inspection_tool'] = dim.inspection_tool; 
    data['critical'] = dim.critical; 
    data['units'] = dim.units; 
    data['metric'] = dim.metric; 
    data['target_strings'] = dim.target_strings; 
    data['ref_dim_id'] = dim.ref_dim_id; 
    data['nested_number'] = dim.nested_number; 
    data['met_upper'] = dim.met_upper; 
    data['met_lower'] = dim.met_lower; 
    data['valc'] = dim.valc; 
    data['sheet_id'] = dim.sheet_id; 
    return HttpResponse(json.dumps(data), content_type="application/json",) 

  else: 
      return render(request, 'app/_dims.html')     

url.py

urlpatterns = [ 
    # Examples: 
    url(r'^$', app.views.home, name='home'), 
    url(r'^contact$', app.views.contact, name='contact'), 
    url(r'^about', app.views.about, name='about'), 
    #url(r'^sheet', app.views.sheet, name='sheet'), 
    url(r'^sheet/(?P<customer_id>\w+)$', app.views.sheet, name='sheet_customer'), 
    url(r'^sheet/sheet_form_create.html$', app.views.sheet_form_create, name='sheet_form_create'), 
    url(r'^sheet/sheet_form_create.html/get_work$', app.views.get_work, name='get_work'), 
    url(r'^sheet/(?P<pk>\d+)/sheet_update$', app.views.update_sheet, name='sheet_update'), 
    url(r'^_dims.html$', app.views.add_dimensions, name='dim_update'), 
    url(r'^sheet/(?P<pk>\d+)/delete_sheet$', app.views.delete_sheet, name='sheet_delete'), 
    url(r'^sheet/sheet_form_create.html/_dim$', app.views.add_dimensions, name='dim'), 
    url(r'^_dims.html(?P<pk>\d+)$', app.views.add_dimensions, name='dim'), 
    url(r'^$', app.views.dimtable_asJson, name='dim_table_url'), 
    #url(r^'grid_json/', include (djqgrid.urls)), 

_dims.html

{% block content %} 

  <div class="container" ng-app="Dim"> 
    <h1>Dimensions</h1> 
    <div ng-controller="DimController"> 
      <div class="well"> 
        <h3>Add Dimensions</h3> 
        <form ng-submit="addDim()"> 
          <div class="row"> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.description" placeholder="Description" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.style" placeholder="Style" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.target" placeholder="Target" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.upper_limit" placeholder="Upper Limit" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.lower_limit" placeholder="Lower Limit" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.inspecton_tool" placeholder="Inspection Tool" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.critical" placeholder="Critical" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.units" placeholder="Units" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.metric" placeholder="Metric" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.target_strings" placeholder="Target Strings" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.ref_dim_id" placeholder="Ref Dim Id" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.nested_number" placeholder="Nested Number" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.met_upper" placeholder="Met Upper" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.met_lower" placeholder="Met Lower" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.valc" placeholder="Valc" type="text"></input> 
            </div> 
            <div class="col-xs-6"> 
              <input class="form-control" ng-model="newDim.sheet_id" placeholder="Sheet ID" type="text"></input> 
            </div> 
          </div>     
          <div class="row"> 
            <div class="col-xs-12 text-center"> 
              <br/> 
              <input class="btn btn-primary" type="submit" value="Save Dimension">/</input> {% csrf_token %} 
            </div> 
          </div> 
        </form> 
        <table class="table table-bordered trace-table"> 
          <thead> 
            <tr class="trace-table"> 
              <th class="ts jp" style="border: solid black;">Description</th> 
            </tr> 
          </thead> 
          <tr class="trace-table"> 
            <tr ng-repeat="dim in dims track by $index"> 
              <td class="trace-table" style="border: solid black;">{{ dim.description }}</td> 
            </tr> 
          </tr> 
        </table> 
      </div> 
    </div> 
  </div> 
  <a class="btn btn-danger" ng-click="deleteDim($index)">_</a> 

{% endblock %}. 

Answer 1

如网络选项卡屏幕截图所示，您发送的是 JSON，而不是表单编码的数据。因此，在 Django 中，您需要使用 json.loads(request.body) 来获取字典形式的数据，而不是访问始终为空的 request.POST。

请注意，如果您正在做这样的事情，您几乎肯定应该使用 django-rest-framework，它允许您定义序列化器和反序列化器，它们将自动将您的模型与 JSON 相互转换，并另外验证提交的内容数据。