Question

我有一个json，我作为分层剑道网格的数据源。我搜索了其他问题，但他们与parent-id值进行比较并安排。因为我没有这样的专栏，有没有人知道如何获得所需的json或任何关于如何使用当前json生成分层网格的想法。

我现在的json看起来像

var data=[{
            head:"head1",
            machine:"machine1-1",
            product:"product1-1-1",
            quantity:100
        },
        {
            head:"head1",
            machine:"machine1-1",
            product:"product1-1-2",
            quantity:120
        },
        {
            head:"head1",
            machine:"machine1-2",
            product:"product1-2-1",
            quantity:110
        },
        {
            head:"head2",
            machine:"machine2-1",
            product:"product2-1-1",
            quantity:110
        }];

并且所需的json是

var data=[{
            head:"head1",
            Details:[{
                        Allmachines:
                        [{
                            machine:"machine1-1",
                            Allproducts:
                            [{
                                product:"product1-1-1",
                                quantity:100
                            },
                            {
                                product:"product1-1-2",
                                quantity:120
                            }]
                        },
                        {
                            machine:"machine1-2",
                            Allproducts:
                            [{
                                product:"product1-2-1",
                                quantity:110
                            }]
                        }]
                    }]
        },
        {
            head:"head2",
            Details:[{
                        Allmachines:
                        [{
                            machine:"machine2-1",
                            Allproducts:
                            [{
                                product:"product2-1-1",
                                quantity:110
                            }]
                        }]
                    }]
        }]

有什么想法吗？谢谢！

Answer 1

这可能是一个广泛的问题。我会使用reduce来创建这样的树。

在代码段中，在第一个reduce中，它创建了一个数组，其中包含输入数组中存在的所有唯一head。

接下来，我们进入下一级别并创建Allmachines属性。您可以看到控制台的结果数组。

虽然以下代码片段只是解决方案的一半，但我希望它能提供一个良好的开端，您可以从那里获得预期的结果。

＆＃13;

var data = [{
    head: "head1",
    machine: "machine1-1",
    product: "product1-1-1",
    quantity: 100
  },
  {
    head: "head1",
    machine: "machine1-1",
    product: "product1-1-2",
    quantity: 120
  },
  {
    head: "head1",
    machine: "machine1-2",
    product: "product1-2-1",
    quantity: 110
  },
  {
    head: "head2",
    machine: "machine2-1",
    product: "product2-1-1",
    quantity: 110
  }
];

var res = data.reduce((arr, obj) => {
  var cur = arr.filter(o => o.head === obj.head)[0]
  if (!cur) {
    arr.push({
      "head": obj.head
    })
  }
  return arr;
}, []);


res = res.reduce((arr, obj) => {
  obj.Details = obj.Details || [{
    Allmachines: []
  }];
  // add machine and product similarly from here on
  return arr;
}, res);

console.log(res)

＆＃13;

从扁平的json重新排列到树Angularjs

1 个答案: