如何从包含带有外键的 django-rest-api 字段的 Angular 选择下拉字段中获取

Question

我有一个Angular在客户端和Django后端运行的应用程序，我将其Django-request-framework用于我的模型序列化，由此我的模型有一个名为的模型Job，该模型又有一个名为的字段，该字段job_category指向JobCategory像这样的外键关系中的模型

models.py

JobCategory(models.Model):

    title = models.CharField(max_value=100)

Job(models.Model):

    title = models.CharField(max_value=200)

    job_category = models.ForeignKeyField(JobCategory, on_delete=models.CASCADE)

所以在我的角度组件上，我有一个选择字段，它循环遍历这样的工作类别

Angular 组件 html 表单

<select id="category" class="form-control color-gray" ngModel name='category'>

         <option *ngFor='let category of job_categories' [ngValue]="category.id" >{{ category.title }}

         </option>

</select>

那时一切正常，直到我从 Angular 选项中选择一个工作类别并发布它，然后我得到错误

"ValueError at /api/jobs/↵Cannot assign "'Companion Care'": "Job.job_category" must be a "JobCategory" instance.

我该如何解决这个问题或者你如何选择一个实例JobCategory？

Answer 1

您依靠此处的字符串方法将外键作为人类可读的名称传递。但是，您的下拉菜单正确传递了 ID。我想您也将此序列化程序用于 RetrieveApiView，因此您可以通过一种简单的方法在详细信息视图中内联类别。要解决这个更新问题，请使用第二个序列化程序进行更新：class JobUpdateSerializer(serializers.ModelSerializer):&nbsp; &nbsp; category = serializers.PrimaryKeyRelatedField(source='job_category')&nbsp; &nbsp; class Meta:&nbsp; &nbsp; &nbsp; &nbsp; model = Job&nbsp; &nbsp; &nbsp; &nbsp; fields =['id','title','category']如果你想保留一个序列化程序，那么你需要做更多的工作来修复前端，因为你的有效载荷将嵌套，但你可以同时访问 id 和 name（通过主键更新更安全和更清晰，因为它不受限制国际化，例如）：class JobSerializer(serializers.ModelSerializer):&nbsp; &nbsp; category = JobCategorySerializer(source='job_category')&nbsp; &nbsp; class Meta:&nbsp; &nbsp; &nbsp; &nbsp; model = Job&nbsp; &nbsp; &nbsp; &nbsp; fields =['id','title','category']输出将是：{&nbsp; &nbsp; "id": 1,&nbsp; &nbsp; "title": "dog",&nbsp; &nbsp; "category": {&nbsp; &nbsp; &nbsp; &nbsp; "id": 2,&nbsp; &nbsp; &nbsp; &nbsp; "title": "animal"&nbsp; &nbsp; }}