2016-02-05 86 views
0

我的數據,我從REST API獲取我想要創建一個使用$http陣列轉型與angular.forEach - AngularJS

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 
      } ] 
     } ] 
} 

,你可以使用Angular傳遞迴我API前新object看到我有orderItem其中包含幾個menu_modifier_groups然後包含幾個menu_modifier_items

我想要做的就是將該數據轉換;

cartItemcartModifierItems

cartItem將是:

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 
cartModifierItems: // an array containing all menu_modifier_items from all the menu_modifier_groups where selected = true 

然後cartModifierItems將會從所有menu_modifier_groups其中selected: true這樣我留下了cartItemcartItem.cartModifierItems

任何所有menu_modifier_items幫助或指導表示讚賞。

+0

您是否需要一個具有cartModifierItems屬性的cartItem對象? –

+0

@ Klaster_1是'cartItem',內部''數組',名爲'cartModifierItems',包含所有'menu_modifier_groups'中的所有'menu_modifier_items',其中'selected = true' –

回答

0

這裏接受OrderItem的輸出cartItem功能:

function makeCartItem(orderItem) { 
    var cartItem = angular.copy(orderItem) 
    delete cartItem.menu_modifier_groups 
    cartItem.cartModifierItems = orderItem.menu_modifier_groups.reduce(function(acc, menuModifierGroup) { 
     const selectedItems = menuModifierGroup.menu_modifier_items.filter(function(item) { 
      return item.selected 
     }) 
     return acc.concat(selectedItems) 
    }, []) 
    return cartItem 
} 

// { 
// "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, 
// "cartModifierItems": [ 
//  { 
//   "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 
//  } 
// ] 
// } 

你的問題是不是真正的角,但更多的在JavaScript中的數據轉換。看看我用達到的效果的方法和功能:

  1. angular.copy。創建深層對象副本。與delete結合本人提出了一個新orderItem衍生副本而不menu_modifier_groups

    var cartItem = angular.copy(orderItem) 
    delete cartItem.menu_modifier_groups 
    
{ 
    "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 
} 
  • Array.prototype.reduce。在menu_modifier_groups上調用時,它會將每個值累加到作爲第一個參數傳遞的函數返回的新數組(第二個參數)中。

  • Array.prototype.filter。通過傳遞給它的函數來過濾menu_modifier_items。如果任何遍歷的物品具有真實性selected,那麼它被選中。

  • Array.prototype.concat。將累加器數組與選定的項目數組組合到包含兩者的新數組中。

  • JSBin

    +0

    Gracias!感謝您的指導和幫助 –