Angular 以反应形式显示和输入行中的值

“this.orders”是下面API的结果。我的问题是如何获取物料采购订单下的material.name并编辑其数量。你的解决方案是正确的。我就是无法获取要编辑的material.name及其数量

ts

JSON

---

由于您的数据如下所示：

obj={物料采购订单：[{物料：{id:1，名称：'material1'}，数量：2}，…]}
//当你有你的数据时，打这个电话
这个。patchValues（）；
//这是存储api中数据的地方
productsFromApi=[]；
patchValues（）{
让rows=this.myForm.get（'rows'）作为FormArray；
此.obj.material\u purchase\u orders.forEach（material=>{
rows.push（this.fb.group（{material_name:material.material.name，quantity:material.quantity}））
})
}

然后您只需从视图中删除

产品的迭代

，而是显示formarray中的值：

{{row.value.material_name}

---

您的ts看起来怎么样？你的数据看起来怎么样？@AJT_82。请检查上面的更新代码。我的数据只是一系列产品。它应该在r中的*ngFor上，但我不能在r中迭代两个*ngFor。所以我把“产品*ngFor”放在屏幕上，但这不是我想要的。它应该在@AJT_82上。我还添加了一张我想出现的图片。在那里你可以看到产品名称的列表。产品名称列表来源于“产品中的let产品”。数量也来自产品迭代，但您可以在rowsThanks中编辑它。但这就是我如何从材料中获取数据的方法*ngFor=“让物料进入订单。物料\采购\订单”{{material.material.name}。你能帮我展示一下吗？什么是订单？你的代码中没有这样的东西。这就是为什么我问你的数据看起来如何。对不起@AJT_82。这只是一个示例代码。我在api上面添加了第二张图片。订单是我图片中的第一个对象。在那里，您可以找到其中的物料采购订单是物料采购订单中的物料名称请检查我的更新答案。另外，如果有人要求您提供数据，请复制粘贴JSON，而不是添加图片。如果有人想调试您的代码并创建一个演示，那么可以轻松复制JSON。现在我必须写下我自己的回答（希望我做对了！）

 this.route.paramMap
   .switchMap((params: ParamMap) => 
      this.purchaseOrderService.getOrder(+params.get('id')))
        .subscribe(
          (order:any) => {
            this.orders = order;
            console.log(order);
            this.loading = false;
         },
         error => {
            console.log(error);
            this.loading = false;
          }) 

      };




this.myForm = this.fb.group({
      rows: this.fb.array([])
  })

initGroup() {
    let rows = this.myForm.get('rows') as FormArray;
    rows.push(this.fb.group({
      prod_id: [null, Validators.required],
      quantity: [null, Validators.required],
    }))
  }

{
  "id": 11,
  "reference": "pek567",
  "supplier_id": 1,
  "user_id": 1,
  "project_id": 5,
  "total": 100,
  "transaction_date": "2017-10-08",
  "created_at": "2017-10-31 13:10:44",
  "updated_at": "2017-10-31 13:10:44",
  "user": {
    "id": 1,
    "name": "John",
    "email": "john@gmail.com",
    "created_at": "2017-10-26 07:32:53",
    "updated_at": "2017-10-26 11:58:44"
  },
  "supplier": {
    "id": 1,
    "name": "Not Available",
    "address": "Not Available",
    "city": "Not Available",
    "contact_number": "Not Available",
    "created_at": "2017-10-26 16:12:22",
    "updated_at": "2017-10-26 16:12:22"
  },
  "material_purchase_orders": [
    {
      "id": 11,
      "material_id": 49,
      "purchase_order_id": 11,
      "quantity": 1,
      "unit": "pcs",
      "price": 100,
      "created_at": "2017-10-31 13:10:44",
      "updated_at": "2017-10-31 13:10:44",
      "material": {
        "id": 49,
        "sku": "D16789",
        "name": "Door",
        "created_at": "2017-10-26 03:33:06",
        "updated_at": "2017-10-26 03:33:06"
      }
    }
  ],
  "user_name": "John"
}