Iterating through an array with internal arrays and creating new objects - AngularJS

Question

I have an object that I retrieve from my REST API...

I want to iterate over an array and create objects / arrays from it

This is an array;

orderItemcontains menu_modifier_groupswhich containmenu_modifier_items

orderItem→ menu_modifier_groups→menu_modifier_items

orderItem:  { 
    id: 159
    name: Empanadas (Choice of 2)
    description: Choice of Diced Beef; Spinach, Stilton and Onion; or Smoked Ham and Mozzarella
    price: 700
    available: 1
    created_at: 2016-01-31 16:50:31
    updated_at: 2016-01-31 16:50:31
    menu_category_id: 41
    restaurant_id: 11
    menu_modifier_groups: 
        [  { 
            id: 9
            name: Choose 2 Empanadas
            instruction: null
            min_selection_points: 2
            max_selection_points: 2
            force_selection: 1
            created_at: 2016-02-01 01:03:35
            updated_at: 2016-02-01 01:12:23
            menu_item_id: 159
            restaurant_id: 11
                menu_modifier_items: 
                [  { 
                    id: 34
                    name: Diced Beef
                    price: 0
                    created_at: 2016-02-01 01:04:08
                    updated_at: 2016-02-01 01:04:08
                    menu_modifier_group_id: 9
                    restaurant_id: 11
                    menu_item_id: 159
                    selected: true
                 } ,  { 
                    id: 35
                    name: Smoked Salmon & Mozzarella
                    price: 0
                    created_at: 2016-02-01 01:04:37
                    updated_at: 2016-02-01 01:04:37
                    menu_modifier_group_id: 9
                    restaurant_id: 11
                    menu_item_id: 159
                    selected: true
                 } ,  { 
                    id: 36
                    name: Stilton, Spinach and Onion
                    price: 0
                    created_at: 2016-02-01 01:05:05
                    updated_at: 2016-02-01 01:05:05
                    menu_modifier_group_id: 9
                    restaurant_id: 11
                    menu_item_id: 159
                    selected: false
             }  ]
         }  ]
 }

From what I get from mine REST API, what I want to do is transform this orderItemone to become;

// the main item + menu_modifier_items(where selected = true) without menu_modifier_groups

$scope.mainItem = 
{
id: 159
name: Empanadas (Choice of 2)
description: Choice of Diced Beef; Spinach, Stilton and Onion; or Smoked Ham and Mozzarella
price: 700
available: 1
created_at: 2016-01-31 16:50:31
updated_at: 2016-01-31 16:50:31
menu_category_id: 41
restaurant_id: 11
menu_modifier_items:
[  { 
    id: 34
    name: Diced Beef
    price: 0
    created_at: 2016-02-01 01:04:08
    updated_at: 2016-02-01 01:04:08
    menu_modifier_group_id: 9
    restaurant_id: 11
    menu_item_id: 159
    selected: true
 } ,  { 
    id: 35
    name: Smoked Salmon & Mozzarella
    price: 0
    created_at: 2016-02-01 01:04:37
    updated_at: 2016-02-01 01:04:37
    menu_modifier_group_id: 9
    restaurant_id: 11
    menu_item_id: 159
    selected: true
 } ]
}

Therefore, I can use it with $http, as shown below;

$scope.addItem = function(orderItem) {

//transform orderItem here into mainItem

    $http({
        method: 'post',
        url: "http://api.example.com/web/cart/item/add",
        data: $.param({
            'cartItem': $scope.mainItem
        }),
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).success(function (data, status, headers, config) {
    });
}

Any advice / recommendations appreciated.

Answer 1

javascript, Lodash, . javascript.

// Build your array of modifierItems by looping through the menu_modifier_group entries and taking only the ones that have selected: true
var modifierItems = [];
for (var i = 0; i < orderItem.menu_modifier_groups.length; i++)
{
    if (orderItem.menu_modifier_groups[i].selected.menu_modifier_items)
    {
       for (var j = 0; j < orderItem.menu_modifier_groups[i].menu_modifier_items.length; j++)
       {
            if(orderItem.menu_modifier_groups[i].menu_modifier_items[j].selected === true)
            {
                 modifierItems.push(orderItem.menu_modifier_groups[i].menu_modifier_items[j]);
            }
       }

    }
}

// Now get rid of menu_modifier_groups, and use the remaining orderItem object as your $scope.mainItem, 
// and add the array of modifier items you built above as menu_modifier_items
delete orderItem.menu_modifier_groups;
$scope.mainItem = orderItem;
$scope.mainItem.menu_modifier_items = modifierItems;

// Now do your $http stuff