Javascript 复杂的 if 语句

Javascript complicated if statement

好的,所以我处于 Angularjs/Javascript 的情况。我有一个来自 json 的项目列表,它们都有子类别。所以我需要做的是,当我的列表显示时,如果用户在该列表中选择了这个项目,那么相关子类别中的所有内容都会显示。

例子

Group [
    { Item 1:
        { sub 30,
    },
    Item 2:
        { sub 53,
    },
    Item 7:
        { sub 21,
    },
    Item 2:
        { sub 97,
    },
}]

如您所见,有两个 "Item 2"。如果用户选择项目 2,则将显示子 53 和 97。我不知道如何执行条件语句,或者是否有任何方法可以执行 'Angular way'

这不是 angular 具体的,但我会在收到您的数据后对其进行处理,以便更容易获得项目属性引用的子值列表。

 var newGroup = {
    'Item 1': [30],
    'Item 2': [53, 97],
    'Item 3': [21]
};

然后你可以在 ng-repeat

中使用键值语法
<div ng-repeat="(key, value) in myObj"> ... </div>

假设用户已经选择了其中一项,并且列表中有很多子项。 最简单的方法是在 'user selection'

上分配一个变量作为所选项目及其子项目
 ...// on user selection 
 $scope.selectedItem = 'itemName from user input'; 
 $scope.selected = $array_of_subitems; // this is item2 for example , and contains all the subs belonging to that

注意:如果你能提供更多关于如何调用选择的细节,我可以改进上面的代码

在您的 html 中,由于您需要显示所选元素,因此您可以轻松地显示所有子项

 <h1>Item Named : {{selectedItem}} has following subitems</h1>
 <div ng-repeat="subitem in selected">
      {{subitem}}
 <div>

试试这个:

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

function MyCtrl($scope) {
    var items = [
        {
            "Item 1": "sub 30"
        },
        {
            "Item 2": "sub 53"
        },
        { 
            "Item 7": "sub 21",
        },
        {
            "Item 2": "sub 97"
        }
    ];
    
    var grouped = {};
    for (var i=0; i<items.length; i++) {
        for (var item in items[i]) {
            if (!grouped[item]) {
                grouped[item] = {};
                grouped[item].subs = [];
            }
            grouped[item].subs.push(items[i][item]);
        }
    }
    
    $scope.group = grouped;
    
    $scope.toggleSubs = function(item) {
       $scope.group[item].showSubs = !$scope.group[item].showSubs;
    }
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app ng-controller="MyCtrl">
    <div ng-repeat="(item, data) in group">
        <a href ng-click="toggleSubs(item)">{{item}}</a>
        <div ng-show="data.showSubs">
            <div ng-repeat="sub in data.subs">
             <ul>
                 <li>{{sub}}</li>
             </ul>
            </div>
        </div>
    </div>
</div>