从数组中提取值列表，消除重复

Question

我有各种各样的菜。 所有菜肴均具有其所属的类别，并且多个菜肴可以属于同一类别。 如何使用碗碟数组生成这些类别的列表（在下面的列表中的dishCategory ）并将其拉到我的控制器中，从而消除任何笨蛋？ （到目前为止，我已经进行了硬编码，但是效率很低）。 这是一个矮人来说明我的情况

DISHLIST.js：

angular.module('wmapp.factory_dishes', [])

wmapp.factory('dishesFactory', function () {
    "use strict";
    var factory = {
            dishes : [
                {nameEnglish: 'TAPENADE', nameLocal: 'Tapenade', description: 'xxxxxx',  region: 'Provence-Alpes-Côte d\'Azur', regioncode: 'FR.B8', itemid: 'FR002', cuisineTypeIsoCode: 'FR',  dishCategory: 'Bakery', country: 'France', type: 'top_10'},
                {nameEnglish: 'GREEK STYLE MUSHROOMS  ', nameLocal: 'xxxxx',  region: 'All', regioncode: '', itemid: 'FR003', cuisineTypeIsoCode: 'FR',  dishCategory: 'Pie / pizza', country: 'France', type: ''},
                {nameEnglish: 'HAM & CHEESE TOASTED SANDWICHS / WITH EGGS', nameLocal: 'Croque Monsieur / Croque Madame', description: 'xxxxxxx',  region: 'All', regioncode: '', itemid: 'FR005', cuisineTypeIsoCode: 'FR',  dishCategory: 'Sandwich', country: 'France'},
                {nameEnglish: 'ONION SOUP', nameLocal: 'Soupe à l’oignon', description: 'xxxxx',  region: 'All', regioncode: '', itemid: 'FR008', cuisineTypeIsoCode: 'FR',  dishCategory: 'Pie / pizza', country: 'France', type: 'top_10'}
                {nameEnglish: 'VEAL ESCALOPE WITH CREAMY MUSHROOM DRESSING', nameLocal: 'xxxxx',  region: 'Lower Normandy', regioncode: 'FR.99', itemid: 'FR047', cuisineTypeIsoCode: 'FR',  dishCategory: 'Side dish', country: 'France'},
                {nameEnglish: 'ROASTED PORK WITH PRUNES', nameLocal: 'Roti de porc aux pruneaux', description: ' ',  region: 'Poitou-Charentes', regioncode: 'FR.B7', itemid: 'FR048', cuisineTypeIsoCode: 'FR',  dishCategory: 'Side dish', country: 'France'},
                {nameEnglish: 'STUFFED TOMATOES', nameLocal: 'Tomates farcies', description: 'xxxx',  region: 'All ', regioncode: '', itemid: 'FR049', cuisineTypeIsoCode: 'FR',  dishCategory: 'Meat', country: 'France'},
                {nameEnglish: 'VEAL PAUPIETTES', nameLocal: '  ',  region: 'Lower Normandy', regioncode: 'FR.99', itemid: 'FR050', cuisineTypeIsoCode: 'FR',  dishCategory: 'Meat', country: 'France'},
                {nameEnglish: 'ROAST LEG OF LAMB', nameLocal: 'Gigot d’agneau', description: 'xxxxxx.',  region: 'Lower Normandy', regioncode: 'FR.99', itemid: 'FR051', cuisineTypeIsoCode: 'FR',  dishCategory: 'Main', country: 'France', type: 'top_10'},
                {nameEnglish: 'BAKED WITLOF AND HAM', nameLocal: 'Gratin d’endives au jambon', description: 'xxxxxx ',  region: 'Nord-Pas-de-Calais', regioncode: 'FR.B4', itemid: 'FR052', cuisineTypeIsoCode: 'FR',  dishCategory: 'Meat', country: 'France'},
                {nameEnglish: 'SMOKED PORK WITH GREEN LENTILS', nameLocal: 'Petit sale aux lentilles', description: 'xxxx',  region: 'Auvergne', regioncode: 'FR.98', itemid: 'FR053', cuisineTypeIsoCode: 'FR',  dishCategory: 'Main', country: 'France'},
                {nameEnglish: 'BLUE RIBBON', nameLocal: 'Cordon bleu', description: 'xxxxxx',  region: 'All ', regioncode: '', itemid: 'FR054', cuisineTypeIsoCode: 'FR',  dishCategory: 'Main', country: 'France'},

            ],
            getDishes : function () {
                return factory.dishes;
            },
            getDish : function (itemid) {
                var dish = {};
                angular.forEach(factory.dishes, function (value, key) {
                    if (value.itemid === itemid) {
                        dish = value;
                    }
                });

                return dish;
            }
        };
    return factory;
});

碟片类别的控制器：

 var wmapp = angular.module('app', []);

// dishlistcontroller 
 wmapp.controller('dishTypeListController', function ($scope, $rootScope) {
    "use strict";
    $scope.dishTypeList = [
        {'name': 'Bakery'},
        {'name': 'Beverage'},
        {'name': 'Meat'},
        {'name': 'Pastry'},
        {'name': 'Pie / pizza'},
        {'name': 'Salads'},
        {'name': 'Sandwich'}
    ];
    $scope.selection = [];


})

Answer 1

我通常将其像下划线或lodash一样留给lib来进行这种类型的事情，但是您绝对可以使用像user3906922建议的普通香草js来做到这一点。

参见下文（并打开控制台以查看结果...）：

 var dishes = [ {nameEnglish: 'TAPENADE', nameLocal: 'Tapenade', description: 'xxxxxx', region: 'Provence-Alpes-Côte d\\'Azur', regioncode: 'FR.B8', itemid: 'FR002', cuisineTypeIsoCode: 'FR', dishCategory: 'Bakery', country: 'France', type: 'top_10'}, {nameEnglish: 'GREEK STYLE MUSHROOMS ', nameLocal: 'xxxxx', region: 'All', regioncode: '', itemid: 'FR003', cuisineTypeIsoCode: 'FR', dishCategory: 'Pie / pizza', country: 'France', type: ''}, {nameEnglish: 'HAM & CHEESE TOASTED SANDWICHS / WITH EGGS', nameLocal: 'Croque Monsieur / Croque Madame', description: 'xxxxxxx', region: 'All', regioncode: '', itemid: 'FR005', cuisineTypeIsoCode: 'FR', dishCategory: 'Sandwich', country: 'France'}, {nameEnglish: 'ONION SOUP', nameLocal: 'Soupe à l'oignon', description: 'xxxxx', region: 'All', regioncode: '', itemid: 'FR008', cuisineTypeIsoCode: 'FR', dishCategory: 'Pie / pizza', country: 'France', type: 'top_10'}, {nameEnglish: 'VEAL ESCALOPE WITH CREAMY MUSHROOM DRESSING', nameLocal: 'xxxxx', region: 'Lower Normandy', regioncode: 'FR.99', itemid: 'FR047', cuisineTypeIsoCode: 'FR', dishCategory: 'Side dish', country: 'France'}, {nameEnglish: 'ROASTED PORK WITH PRUNES', nameLocal: 'Roti de porc aux pruneaux', description: ' ', region: 'Poitou-Charentes', regioncode: 'FR.B7', itemid: 'FR048', cuisineTypeIsoCode: 'FR', dishCategory: 'Side dish', country: 'France'}, {nameEnglish: 'STUFFED TOMATOES', nameLocal: 'Tomates farcies', description: 'xxxx', region: 'All ', regioncode: '', itemid: 'FR049', cuisineTypeIsoCode: 'FR', dishCategory: 'Meat', country: 'France'}, {nameEnglish: 'VEAL PAUPIETTES', nameLocal: ' ', region: 'Lower Normandy', regioncode: 'FR.99', itemid: 'FR050', cuisineTypeIsoCode: 'FR', dishCategory: 'Meat', country: 'France'}, {nameEnglish: 'ROAST LEG OF LAMB', nameLocal: 'Gigot d'agneau', description: 'xxxxxx.', region: 'Lower Normandy', regioncode: 'FR.99', itemid: 'FR051', cuisineTypeIsoCode: 'FR', dishCategory: 'Main', country: 'France', type: 'top_10'}, {nameEnglish: 'BAKED WITLOF AND HAM', nameLocal: 'Gratin d'endives au jambon', description: 'xxxxxx ', region: 'Nord-Pas-de-Calais', regioncode: 'FR.B4', itemid: 'FR052', cuisineTypeIsoCode: 'FR', dishCategory: 'Meat', country: 'France'}, {nameEnglish: 'SMOKED PORK WITH GREEN LENTILS', nameLocal: 'Petit sale aux lentilles', description: 'xxxx', region: 'Auvergne', regioncode: 'FR.98', itemid: 'FR053', cuisineTypeIsoCode: 'FR', dishCategory: 'Main', country: 'France'}, {nameEnglish: 'BLUE RIBBON', nameLocal: 'Cordon bleu', description: 'xxxxxx', region: 'All ', regioncode: '', itemid: 'FR054', cuisineTypeIsoCode: 'FR', dishCategory: 'Main', country: 'France'}, ]; var categories = _.chain(dishes) //Easier chaining in underscore so I don't have to pass the array to subsequent calls.. .map(function(d) { return { name : d.dishCategory }; }) //pull out the dishCategory and return it in the desired format .uniq(function(c) { return c.name; }) //ensure that the new category list is unique .sort(function(c) { return c.name; }) //extra credit... sort it .value(); //finally, get it out of underscore into a proper category array... [ { name: 'blah' }, {name : 'blah1'} ] console.log(categories); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> 

Answer 2

您可以在工厂上添加一个功能，以获取不同的菜品类别：

getCategories: function() {
    var categories = [], o = {};
    angular.forEach(factory.dishes, function (value, key) {
        if (o.hasOwnProperty(value.dishCategory)) {
            return;
        }
        categories.push(value.dishCategory);
        o[value.dishCategory] = true;
    });
    return categories;
}

然后将该工厂注入您的控制器，并调用该函数：

wmapp.controller('dishTypeListController', function ($scope, $rootScope, dishesFactory) {
    "use strict";

    $scope.selection = [];
    $scope.categories = dishesFactory.getCategories();

})

检查这个矮子 。