根据选定的值显示数组中的值(从数组中构建一个字符串)

时间:2019-06-19 19:13:54

标签: javascript arrays angularjs

我需要基于从对象数组中选择的值来显示自定义字符串值。 我想我已经接近了,但是有一个小问题我无法弄清楚。

现在,如果我从“获得”中选择所有内容,并从“静态”中选择一项 return语句将为“ 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"
      }
};

我要构建的是选择了所有部分后,我需要返回一个字符串,例如

  • “获得的总和”-如果仅选择“获得的”
  • “静态总和-如果仅选择静态
  • “获得的和静态的总和”-如果同时选择了“获得的和静态的”

如果未选择所有部分,那么我想列出各个子名称(如果适用),并以逗号分隔,最后一个逗号应为“&”,例如- “新建,赢得并重新启动之和”)

1 个答案:

答案 0 :(得分:1)

以下情况似乎仅在所有子项的Selected都等于true时才算为true。

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

如果我没记错的话,那么您会想要的:

if(children.length > 0){

因为孩子代表了列表中的“选定项目”。