Question

Hy先生，我有一个包含多个输入和下拉菜单的表单，根据用户的选择，最终结果是这样的：

sortAlphabetical: true

我想要的只是循环通过对象并创建一个如下所示的新对象：

var optionVariants = [
    {
       attribute: {
          id: 1,
          name: 'Color'
    },
       values: ['red', 'green']
    },
    {
       attribute: {
          id: 2,
          name: 'Size'
    },
       values: ['small', 'medium', 'large']
    }
];

我试图创建空数组，在其中推送项目，循环通过它们但我找不到正确的解决方案来按照我想要的方式对它们进行分组。

我不是javascript专家，而且我还在学习，所以对我很温柔：D

这就是我的尝试：

        var newObject = [
            {
                attributes: [
                    {
                        id: 1,
                        name: 'Color',
                        value: 'red'
                    },
                    {
                        id: 2,
                        name: 'Size',
                        value: 'small'
                    }
                ]
            },
            {
                attributes: [
                    {
                        id: 1,
                        name: 'Color',
                        value: 'red'
                    },
                    {
                        id: 2,
                        name: 'Size',
                        value: 'medium'
                    }
                ]
            },
            {
                attributes: [
                    {
                        id: 1,
                        name: 'Color',
                        value: 'red'
                    },
                    {
                        id: 2,
                        name: 'Size',
                        value: 'large'
                    }
                ]
            },
            {
                attributes: [
                    {
                        id: 1,
                        name: 'Color',
                        value: 'green'
                    },
                    {
                        id: 2,
                        name: 'Size',
                        value: 'small'
                    }
                ]
            },
            {
                attributes: [
                    {
                        id: 1,
                        name: 'Color',
                        value: 'green'
                    },
                    {
                        id: 2,
                        name: 'Size',
                        value: 'medium'
                    }
                ]
            },
            {
                attributes: [
                    {
                        id: 1,
                        name: 'Color',
                        value: 'green'
                    },
                    {
                        id: 2,
                        name: 'Size',
                        value: 'large'
                    }
                ]
            }
        ];

Answer 1

var optionVariants = [
    {
        attribute: {
            id: 1,
            name: 'Color'
        },
        values: ['red', 'green']
    },
    {
        attribute: {
            id: 2,
            name: 'Size'
        },
        values: ['small', 'medium', 'large']
    }
];

var firstObjectValues = optionVariants[0]['values'];
var secondObjectValues = optionVariants[1]['values'];
var firstObjectValuesAmount = firstObjectValues.length;
var secondObjectValuesAmount = secondObjectValues.length;
var newObject = [];

for (var i = 0; i < firstObjectValuesAmount; i++) {
    
    for (var j = 0; j < secondObjectValuesAmount; j++) {
        var obj1 = {};
        obj1.id = optionVariants[0]['attribute'].id;
        obj1.name = optionVariants[0]['attribute'].name;
        obj1.value = optionVariants[0]['values'][i];

        var obj2 = {};
        obj2.id = optionVariants[1]['attribute'].id;
        obj2.name = optionVariants[1]['attribute'].name;
        obj2.value = optionVariants[1]['values'][j];

        var finalObj = {
            attributes: [obj1, obj2]
        };

        newObject.push(finalObj);
    }
    
}

console.log(newObject);

就是这样！

Answer 2

我设法做到了......它是有角度的，因为这是我的项目所使用的，但是如果有人需要的话，应该很容易将它转换成平原。

来自用户输入的对象或数据如下：

$scope.optionVariants = [
                {
                    attribute: {
                        id: 1,
                        name: 'Color'
                    },
                    values: ['red']
                },
                {
                    attribute: {
                        id: 2,
                        name: 'Size'
                    },
                    values: ['small', 'medium']
                },
                {
                    attribute: {
                        id: 3,
                        name: 'Material'
                    },
                    values: ['cotton']
                },
                {
                    attribute: {
                        id: 4,
                        name: 'Pictures'
                    },
                    values: ['single']
                },
                {
                    attribute: {
                        id: 5,
                        name: 'Lamp'
                    },
                    values: ['led', 'normal']
                }
            ];

用户表单有2个字段，一个用于选择属性的选项，如颜色，大小，材料等，以及一个文本字段，用作标记输入，用户传递以逗号分隔的值。

在角度控制器中我们喜欢这样：

$scope.namedAttributes = [];
    $scope.attributesChanged = function (index) {
        var variants = [];
        var combos = [];
        var nnew = [];
        var variant = [];
        var option = "";
        var ttmp = [];
        var combo = [];

        angular.forEach($scope.optionVariants[0].values, function (element, index) {
            variants.push([element]);
        });

        for (var i = 1; i < $scope.optionVariants.length; i++) {
            combos = [];

            angular.forEach(variants, function (element, index) {
                variant = element;
                nnew = [];

                angular.forEach($scope.optionVariants[i].values, function (element, index) {
                    option = element;

                    ttmp = [];
                    variant.forEach(function (element) {
                        ttmp.push(element);
                    });

                    ttmp.push(option);
                    nnew.push(ttmp);
                });

                combos.push(nnew);
            });

            variants = [];
            angular.forEach(combos, function (element, index) {
                combo = element;
                combo.forEach(function (element) {
                    variants.push(element);
                });
            });
        }

        $scope.namedAttributes = [];
        angular.forEach(variants, function (element, index) {
            var attributes = [];
            for (var i = 0; i < element.length; i++) {
                attributes.push({
                    id: $scope.optionVariants[i].attribute.id,
                    name: $scope.optionVariants[i].attribute.name,
                    value: element[i]
                });
            }

            $scope.namedAttributes.push({
                attributes: attributes
            });
        });
    };

最后，$ scope.namedAttributes转换为：

[
                {
                    attributes: [
                        {
                            id: 1,
                            name: 'Color',
                            value: 'red'
                        },
                        {
                            id: 2,
                            name: 'Size',
                            value: 'small'
                        },
                        {
                            id: 3,
                            name: 'Material',
                            value: 'cotton'
                        },
                        {
                            id: 4,
                            name: 'Pictures',
                            value: 'single'
                        },
                        {
                            id: 5,
                            name: 'Lamp',
                            value: 'led'
                        }
                    ]
                },

                {
                    attributes: [
                        {
                            id: 1,
                            name: 'Color',
                            value: 'red'
                        },
                        {
                            id: 2,
                            name: 'Size',
                            value: 'small'
                        },
                        {
                            id: 3,
                            name: 'Material',
                            value: 'cotton'
                        },
                        {
                            id: 4,
                            name: 'Pictures',
                            value: 'single'
                        },
                        {
                            id: 5,
                            name: 'Lamp',
                            value: 'normal'
                        }
                    ]
                }
            ]

结合javascript对象的值

2 个答案: