如何使用Angular.js/Javascript按键值对数组进行排序

时间:2022-04-30 11:26:52

I need one help. I need to sort an array as per key value with one specific format using Angular.js/Javascript.I am explaining my array below.

我需要一个帮助。我需要使用Angular.js/Javascript按键值对数组进行排序,使用一种特定的格式。我将在下面解释我的数组。

var stepsModel=[
      {'day_id':2,'day_name':'Tuesday','image':"1.png"},
      {'day_id':2,'day_name':'Tuesday','image':"2.png"},
      {'day_id':2,'day_name':'Tuesday','image':"3.png"},
      {'day_id':3,'day_name':'Wednsday','image':"1.png"},
      {'day_id':3,'day_name':'Wednsday','image':"2.png"}
]

The above is my given array.i need to sort it as per the day_id.My expected output is given below.

上面是给定的数组。我需要按照day_id进行排序。我的期望输出如下所示。

var output = [
    {
        'day_id': 2,
        'day_name': 'Tuesday',
        'special': [
            { 'image': 1. png },
            { 'image': 2. png },
            { 'image': 3. png }
        ]
    },
    {
        'day_id': 3,
        'day_name': 'Wednsday',
        'special': [
            { 'image': 1. png },
            { 'image': 2. png }
        ]
    }
]

Please help me to sort the given array and get the result like above.

请帮助我对给定的数组进行排序,得到如上所示的结果。

2 个解决方案

#1


3  

You could use a hash table for the right assignment of the images to the days.

你可以用一个哈希表来分配图像的时间。

Optional, you could use Array#reduce instead of Array#forEach, if you like to use a compact style.

可选的,如果您喜欢使用紧凑的样式,您可以使用数组#reduce而不是数组#forEach。

var stepsModel = [
    { 'day_id': 2, 'day_name': 'Tuesday', 'image': "1.png" },
    { 'day_id': 2, 'day_name': 'Tuesday', 'image': "2.png" },
    { 'day_id': 2, 'day_name': 'Tuesday', 'image': "3.png" },
    { 'day_id': 3, 'day_name': 'Wednsday', 'image': "1.png" },
    { 'day_id': 3, 'day_name': 'Wednsday', 'image': "2.png" }
];
var grouped = [];

stepsModel.forEach(function(a) {
    if (!this[a.day_id]) {
        this[a.day_id] = { day_id: a.day_id, day_name: a.day_name, special: [] };
        grouped.push(this[a.day_id]);
    }
    this[a.day_id].special.push({ image: a.image });
}, Object.create(null));

console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }

#2


1  

You can use reduce function for it to create an object that acts like dictionary and then call a map function on it's keys like this:

你可以用reduce函数来创建一个像dictionary一样的对象然后在它的键上调用一个map函数

var groupedDays = stepsModel.reduce((steps, step) => {
    if (!steps[step.day_id])
        steps[step.day_id] = ({ day_id: step.day_id, day_name: step.day_name, special: [] })

    steps[step.day_id].special.push({image: step.image})
    return steps
}, {});

var output = Object.keys(groupedDays).map(k => groupedDays[k])

#1


3  

You could use a hash table for the right assignment of the images to the days.

你可以用一个哈希表来分配图像的时间。

Optional, you could use Array#reduce instead of Array#forEach, if you like to use a compact style.

可选的,如果您喜欢使用紧凑的样式,您可以使用数组#reduce而不是数组#forEach。

var stepsModel = [
    { 'day_id': 2, 'day_name': 'Tuesday', 'image': "1.png" },
    { 'day_id': 2, 'day_name': 'Tuesday', 'image': "2.png" },
    { 'day_id': 2, 'day_name': 'Tuesday', 'image': "3.png" },
    { 'day_id': 3, 'day_name': 'Wednsday', 'image': "1.png" },
    { 'day_id': 3, 'day_name': 'Wednsday', 'image': "2.png" }
];
var grouped = [];

stepsModel.forEach(function(a) {
    if (!this[a.day_id]) {
        this[a.day_id] = { day_id: a.day_id, day_name: a.day_name, special: [] };
        grouped.push(this[a.day_id]);
    }
    this[a.day_id].special.push({ image: a.image });
}, Object.create(null));

console.log(grouped);
.as-console-wrapper { max-height: 100% !important; top: 0; }

#2


1  

You can use reduce function for it to create an object that acts like dictionary and then call a map function on it's keys like this:

你可以用reduce函数来创建一个像dictionary一样的对象然后在它的键上调用一个map函数

var groupedDays = stepsModel.reduce((steps, step) => {
    if (!steps[step.day_id])
        steps[step.day_id] = ({ day_id: step.day_id, day_name: step.day_name, special: [] })

    steps[step.day_id].special.push({image: step.image})
    return steps
}, {});

var output = Object.keys(groupedDays).map(k => groupedDays[k])