从 Angular 数组中获取所有材料 [英] Get All Materials from Array in Angular

问题描述

我在 stackblitz 中有这段代码，需要获取所有材料.我怎样才能获得所有材料，而不仅仅是一种材料.输出只是一种材料而不是列表?下面是我的代码https://stackblitz.com/edit/angular-qssycg?file=app/app.component.ts

<块引用>

JSON

订单 =[{身份证":1，名字不可用"，"地址": "不可用","city": "不可用","contact_number": "不可用","created_at": "2017-10-26 16:12:22","updated_at": "2017-10-26 16:12:22",材料": [{身份证":21，"sku": "D22D12D4","name": "D-2, 2D-1, 2D-4","created_at": "2017-10-26 03:03:43","updated_at": "2017-10-26 03:03:43",枢轴":{供应商_id":1，material_id":21}},{身份证":40，"sku": "ACWNAIL","name": "什锦 C.W. 指甲","created_at": "2017-10-26 03:19:54","updated_at": "2017-10-26 03:23:21",枢轴":{供应商_id":1，material_id":40}},{身份证":49，"sku": "DDJENAMEL","name": "门和门框 - 搪瓷","created_at": "2017-10-26 03:33:06","updated_at": "2017-10-26 03:33:06",枢轴":{供应商_id":1，material_id":49}}]}]

<块引用>

ts

patchValues() {let rows = this.myForm.get('rows') as FormArray;this.orders.forEach(材料=> {rows.push(this.fb.group({material_id: material.materials[0].id,material_name: material.materials[0].name,quantity: material.materials[0]}))})}

解决方案

如评论中所述，您需要迭代嵌套数组并将这些值推送到表单数组.所以你的 patchValues 应该是这样的:

patchValues() {let rows = this.myForm.get('rows') as FormArray;this.orders.forEach(材料=> {material.materials.forEach(x => {rows.push(this.fb.group({material_id: x.id,material_name: x.name,数量:'您的数据中没有数量'}))})})}

请注意，您的 JSON 中似乎没有 quantity.此外，此解决方案仅考虑到您的 orders 数组中只有一个对象.如果您知道还有更多，您还需要在您的表单数组中创建表单组.

演示

I have this code in stackblitz that needs to get all materials. How can i get all the materials and not just one. The output is just one materials and not the lists? Here's my code below https://stackblitz.com/edit/angular-qssycg?file=app/app.component.ts

JSON

orders =
  [
  {
    "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",
    "materials": [
      {
        "id": 21,
        "sku": "D22D12D4",
        "name": "D-2, 2D-1, 2D-4",
        "created_at": "2017-10-26 03:03:43",
        "updated_at": "2017-10-26 03:03:43",
        "pivot": {
          "supplier_id": 1,
          "material_id": 21
        }
      },
      {
        "id": 40,
        "sku": "ACWNAIL",
        "name": "Assorted C.W. Nails",
        "created_at": "2017-10-26 03:19:54",
        "updated_at": "2017-10-26 03:23:21",
        "pivot": {
          "supplier_id": 1,
          "material_id": 40
        }
      },
      {
        "id": 49,
        "sku": "DDJENAMEL",
        "name": "Doors & Door Jambs - Enamel",
        "created_at": "2017-10-26 03:33:06",
        "updated_at": "2017-10-26 03:33:06",
        "pivot": {
          "supplier_id": 1,
          "material_id": 49
        }
      }
    ]
  }
]

ts

patchValues() {
    let rows = this.myForm.get('rows') as FormArray;
    this.orders.forEach(material => {
      rows.push(this.fb.group({material_id: material.materials[0].id,material_name: material.materials[0].name, quantity: material.materials[0]}))
    })
  }

解决方案

As mentioned in comments, you need to iterate to nested array and push those values to your form array. So your patchValues should look like this:

patchValues() {
  let rows = this.myForm.get('rows') as FormArray;
  this.orders.forEach(material => {
    material.materials.forEach(x => {
      rows.push(this.fb.group({material_id: x.id,
                               material_name: x.name, 
                               quantity: 'there is no quantity in your data'}))
    })
  })
}

notice, that you don't seem to have quantity in your JSON. Also this solution only takes in consideration that you have only one object in your orders array. If you are aware that there is more, you need to also create formgroups in your formarray.

DEMO

这篇关于从 Angular 数组中获取所有材料的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！