使用$ scope中的angular.foreach从数组中获取值

时间:2015-10-23 02:42:28

标签: arrays angularjs foreach angularjs-scope

我有一个基于另一个代码的动态变化数组,我试图从中检索特定数据。

以下是$ scope.filtereditem下一个动态生成的数组的示例:

[{
  "active": true,
  "createdAt": "2015-10-05T20:19:58.264Z",
  "desc": "With arugula, smoked almonds & chipotle vinaigrette",
  "flavors": [{
    "active": true,
    "name": "Chocolate",
    "price": 8
  }, {
    "active": false,
    "name": "Strawberry",
    "price": 8
  }, {
    "active": false,
    "name": "Hazelnut",
    "price": 8
  }, {
    "active": false,
    "name": "Mint",
    "price": 8
  }],
  "img": "https://signsrestaurant.ca/wp-content/uploads/2015/09/Watermelon-Quinoa-Jimaca-Salad.jpg",
  "name": "Watermelon Quinoa Jicama Salad (<span class=\"vegan\">VE</span>, <span class=\"gfree\">GF</span>, <span class=\"dfree\">DF</span>)",
  "objectId": "x1zpkWmvmP",
  "price": 14,
  "qty": 1,
  "sides": [{
    "active": false,
    "name": "Soup"
  }, {
    "active": false,
    "name": "Salad"
  }, {
    "active": false,
    "name": "Fries"
  }],
  "sizes": [{
    "active": false,
    "name": "Small",
    "price": 5
  }, {
    "active": true,
    "name": "Medium",
    "price": 10
  }, {
    "active": false,
    "name": "Large",
    "price": 15
  }],
  "type": "Soup",
  "updatedAt": "2015-10-21T18:09:37.499Z"
}, {
  "active": true,
  "createdAt": "2015-10-05T20:35:01.363Z",
  "desc": "Buffalo mozzarella, tomato, marinated artichoke hearts, black olives, pesto & balsamic drizzle",
  "flavors": [{
    "active": false,
    "name": "Vanilla",
    "price": 8
  }, {
    "active": false,
    "name": "Almond",
    "price": 8
  }, {
    "active": true,
    "name": "Hazelnut",
    "price": 8
  }, {
    "active": false,
    "name": "Caramel",
    "price": 8
  }],
  "img": "https://signsrestaurant.ca/wp-content/uploads/2015/09/Mediterranean-Salad.jpg",
  "name": "Mediterranean Salad (<span class=\"veg\">V</span>, <span class=\"gfree\">GF</span>)",
  "objectId": "nI5VSpdBUn",
  "price": 15,
  "qty": 2,
  "sides": [{
    "active": false,
    "name": "Soup"
  }, {
    "active": false,
    "name": "Salad"
  }, {
    "active": false,
    "name": "Fries"
  }],
  "sizes": [{
    "active": false,
    "name": "Small",
    "price": 0
  }, {
    "active": true,
    "name": "Medium",
    "price": 5
  }, {
    "active": false,
    "name": "Large",
    "price": 10
  }],
  "type": "Salad",
  "updatedAt": "2015-10-21T18:09:33.422Z"
}]

这只是一个示例,数组会根据其他代码动态更改。我希望实现的是以范围元素的形式检索某些数据,让它命名为$ scope.filteredmenu

这就是我坚持的地方。以下是我到目前为止所做的事情:

  $scope.filteredmenu = function() {
    var order = " ";
    var side = " ";
    angular.forEach($scope.filtereditem, function(item) {
      var flavor = " ";
      var size = " ";
      order += item.name + "Qty: " + item.qty + " , ";
      side += "Side: " + item.type + " , ";
      angular.forEach(item.flavors, function(option) {
        if (option && option.active) {
          flavor += "Flavor: " + option.name + " , ";
        }
      });
      angular.forEach(item.sizes, function(option) {
        if (option && option.active) {
          size += "Size: " + option.name + " , ";
        }
      });
      menuorder += order + side + size + flavor;
    });
    return menuorder;
  };

基本上,我需要这种格式的输出:

对于每件商品, &#39; item.name&#39;数量:&#39; item.qty&#39;,Side:&#39; item.type&#39;,Flavor(以活动为准):option.name(在item.flavors中),Size(以活​​动为准): option.name(在item.sizes中)

最后,我尝试通过电子邮件API发送结果$ scope.filteredmenu。我不确定我做错了什么。任何有关此代码的帮助都将非常感激。

1 个答案:

答案 0 :(得分:1)

有一些语法错误:

var output = function() {
var order = " ";
var side = " ";
//Not defined
var menuorder = '';
angular.forEach($scope.filtereditem, function(item) {
  var flavor = " ";
  var size = " ";
  order += item.name + "Qty: " + item.qty + " , ";
  //plus sign was missing
  side += "Side: " + item.type + " , ";
  angular.forEach(item.flavors, function(option) {
    if (option && option.active) {
      flavor += "Flavor: " + option.name + " , ";
    }
  });
  angular.forEach(item.sizes, function(option) {
    if (option && option.active) {
      size += "Size: " + option.name + " , ";
    }
  });
  menuorder += order + side + size + flavor;
});
return menuorder;
}

$scope.filteredmenu = output();

这是工作中的JSFiddler https://jsfiddle.net/hefc5ewe/