arrays - 如何向数组中的现有对象添加新的键和值(Angular)

Question

我想将新的键和相应的值推送到已经存在的对象。订阅 WEB API 端点后返回我的对象​​。在返回的对象中，我想添加一个“QuantityOnHand”键和值。我尝试了以下操作，但是，它不是我想要的。

branchProduct: BranchProduct;

getProductByName() {

     const productName = this.addProductForm.get('product')?.value;

     const quantity = this.addProductForm.get('quantity')?.value;

     this.branchService.getProductByName(productName).subscribe((resp: any) => {
      this.branchProduct = resp;
      this.branchProduct.QuantityOnHand = quantity;
      console.log(this.branchProduct);
     })

   }

“branchProduct”接口(interface)类如下:

export interface BranchProduct {
  BranchId: number;
  ProductId: number;
  ProductTypeName: string;
  ProductName: string;
  QuantityOnHand: number;
  BaselineQuantity: number;
}

为 QuantityOnHand 属性分配值后，对象将按如下方式记录:

是否可以在创建对象后将 QuantityOnHand 设置为上述对象的实际附加属性？我尝试将“branchProduct”设置为数组并将数量的值插入其中，但是，我没有成功这样做。

感谢任何帮助。

Answer 1

图中显示branchProduct数据位于数组的0索引中。如果branchProduct数据始终是0索引上的一条记录，那么您可以像这样修复它。

getProductByName() {
     const productName = this.addProductForm.get('product')?.value;
     const quantity = this.addProductForm.get('quantity')?.value;
     this.branchService.getProductByName(productName).subscribe((resp: any) => {
      this.branchProduct = resp;
      this.branchProduct[0].QuantityOnHand = quantity;
      console.log(this.branchProduct);
     })

   }

否则，您需要实现一个循环来修改数据。

const branchProductArray = []
branchProductObj.map((product, index) => {
   let productObject = {... product };
    productObject.QuantityOnHand = quantity;
    branchProductArray.push(productObject)

})
console.log(branchProductArray). //will be desire result.