Angular 9绑定嵌套模型反应形式

时间:2020-04-30 20:25:16

标签: sql-server api .net-core angular9

我正在一个使用.Net Core 3.1 API,Angular 9和SQL Server的项目中,想法是我从我的API中获得了这个JSON:

{
"IdProducto": 3,
"NombreProducto": "Pocky",
"Descripcion": "Barquillos cubiertos de chocolate",
"Precio": 15000,
"Cantidad": 10,
"FechaVencimiento": "2020-06-30T00:00:00",
"RutaFotoProducto": "774484",
"TablaNutricion": "77938475",
"FkidCategoria": 3,
"FkidEstadoProducto": 1,
"FkidCategoriaNavigation": {
    "IdCategoria": 3,
    "NombreCategoria": "Chocolates",
    "DescripcionCategoria": "Productos a cubiertos de chocolate",
    "Producto": []
}

我在Angular中有这个接口:

export interface Categoria {
  IdCategoria: number;
  NombreCategoria: string;
  DescripcionCategoria: string;
}

从'./categoria.model'导入{类别};

export interface Producto {
  IdProducto: number;
  NombreProducto: String;
  Descripcion: String;
  Precio: number;
  Cantidad: number;
  FechaVencimiento: Date;
  RutaFotoProducto: String;
  TablaNutricion: String;
  //FkidCategoria:number; This line represents the navigation property of EF Core
  FkidEstadoProducto: number;
  categoria?:Categoria;
}

我的产品服务如下所示:

export class GestionProductoService {

    formRegistroProducto = this.formBuilder.group({
    IdProducto: [0],
    NombreProducto:["",[Validators.required]],
    Descripcion:[""],
    Precio:["",[Validators.required]],
    Cantidad:["",[Validators.required]],
    FechaVencimiento:[""],
    RutaFotoProducto:[""],
    TablaNutricion: [""],
    FkidCategoria:[""],
    FkidEstadoProducto:["",[Validators.required]],
    });

  producto:Producto;
  listaProducto:Producto[];

  get NombreProducto(){
    return this.formRegistroProducto.controls["NombreProducto"];
  }
  get Descripcion(){
    return this.formRegistroProducto.controls["Descripcion"];
  }  get Precio(){
    return this.formRegistroProducto.controls["Precio"];
  }  get Cantidad(){
    return this.formRegistroProducto.controls["Cantidad"];
  }  get FechaVencimiento(){
    return this.formRegistroProducto.controls["FechaVencimiento"];
  }  get RutaFotoProducto(){
    return this.formRegistroProducto.controls["RutaFotoProducto"];
  }  get TablaNutricion(){
    return this.formRegistroProducto.controls["TablaNutricion"];
  }  //get FkidCategoria(){
    //return this.formRegistroProducto.controls["FkidCategoria"];
    //In here I don't know how to implement the caterogia model, because my API is waiting for "FkidCategoria"
  }  get FkidEstadoProducto(){
    return this.formRegistroProducto.controls["FkidEstadoProducto"];
  }
  constructor(private http:HttpClient, private configuracion:ConfiguracionService, private formBuilder:FormBuilder) {}

但是我真的不明白如何在表单上实现嵌套模型以及如何使用它,如果有人可以给我一个提示,那太好了,因为我有一个表来显示产品数据,并且我想使用Categoria模型中的“ NombreCategoria”属性,而不是产品模型中的“ FkidProducto”

0 个答案:

没有答案