Вывести значения из массива на основе выбранных значений (построить строку из массива)

Question

Мне нужно отобразить пользовательские строковые значения на основе выбранных значений из массива объектов. Я думаю, что я близко, но есть небольшая проблема, которую я не могу понять.

Прямо сейчас Если я выбрал все из "Gained" и один предмет из "Static" оператор возврата будет "Gained", и если я выберу все из "Static" и один элемент из "Gained", результатом будет Static,

Блок HTML

<a class="customSegmentSelectorButton" title="{{ ::$parent.Labels.SEGMENTSELECT }}">
    <span ng-if="totalSelectedOptions() == 0">No KPIs</span>
    <span ng-if="totalSelectedOptions() > 0">Sum of {{selectedOptionsLabel()}} </span>
</a>

Компонент

customSegmentOptions = [
    {
        Label: "Gained",
        Children: [
            {
                Label: "New",
                Value: "New",
                Selected: true
            },
            {
                Label: "Win",
                Value: "Win",
                Selected: true
            },
            {
                Label: "Add-On",
                Value: "AddOn",
                Selected: true
            }
        ]
    },
    {
        Label: "Static",
        Children: [
            {
                Label: "Restart",
                Value: "Restart",
                Selected: true
            },
            {
                Label: "Repeat",
                Value: "Repeat",
                Selected: true
            }
        ]
    }
];

selectedOptionsLabel = function(){
    var customSegmentOptions = scope.$parent.customSegmentOptions;
    var isGainedSelected = false;
    var isStaticSelected = false;
    var isChildrenSelected = false;
    var selectedChildrenToDisplay = [];

    for(var index = 0; index < customSegmentOptions.length; index++){
        var item = customSegmentOptions[index];
        var children = item.Children.filter(x => x.Selected == true);
        if(item.Children.length == children.length){
            if(item.Label.toLowerCase() == 'gained'){
                isGainedSelected = true;
            }else{
                isStaticSelected = true;        
            }  
        }    
        selectedChildrenToDisplay = selectedChildrenToDisplay.concat(children.map(x => x.Label));                                      
    }

    isChildrenSelected = selectedChildrenToDisplay.length < 5 && !isGainedSelected ? true : false;

    switch (true) {
        case isGainedSelected && !isStaticSelected && !isChildrenSelected:
          return "Gained";
        case isStaticSelected && !isGainedSelected && !isChildrenSelected:
          return "Static";
        case isStaticSelected && isGainedSelected:
           return "Gained & Static";
        case (!isStaticSelected || !isGainedSelected) && isChildrenSelected:
           console.log(selectedChildrenToDisplay);
         return "children"
      }
};

То, что я пытаюсь построить, - это когда все из одного раздела выбраны, тогда мне нужно вернуть строку, такую ​​как

• «Сумма выигрыша» - если выбран только «Получен выигрыш»
• "Sum of Static - если выбран только Static
• «Сумма полученной и статической» - если выбраны «Усиленная» и «Статическая»

Когда все из одного раздела НЕ выбраны, я хочу перечислить имена отдельных детей, разделенных запятыми, когда это применимо, и последняя запятая должна быть, например, "&" - «Сумма нового, выигрыш и перезапуск»)

Answer 1

Похоже, что следующее значение имеет значение true, только когда все дочерние элементы имеют значение Selected, равное true.

if(item.Children.length == children.length){

Если я не ошибаюсь, чтобы получить желаемый результат, вы хотели бы:

if(children.length > 0){

Потому что дети представляют выбранные элементы в вашем списке.