javascript - 如何从嵌套的 json 数组中选择

Question

我有一个从 API 获取的 JSON:

 $scope.data = [{
        "primary": "white",
        "sub": ["white 1", "white 2", "white 3"]

    },{
        "primary": "black",
       "sub": ["black 1", "black 2", "black 3"]

    }];

我想按主要分组，可选值是 Array sub

喜欢:

**White**
   white 1
   white 2
   white 3
**Black**
   Black 1
   Black 2
   Black 3

我可以按主键分组，但无法获取内部值。这是我拥有的:

<div ng-controller="myCtrl">
    <select
        ng-model="myOption"
        ng-options="val.primary group by value.primary for value in data">

    </select>
    <div>
        ng-model value: {{myOption}}
    </div>
</div>

(这是我的 fiddle :http://jsfiddle.net/jm6of9bu/648/)

Answer 1

你需要展平你的数组。即使使用 group by，ng-options 也适用于平面数组:

$scope.data2 = [
    {primary: "white", sub: "white1"},
    {primary: "white", sub: "white2"},
    {primary: "white", sub: "white3"},
    {primary: "black", sub: "black1"},
    {primary: "black", sub: "black2"},
    {primary: "black", sub: "black3"},
    ];

然后你可以这样做:

<select
    ng-model="myOption"
    ng-options="value as value.sub group by value.primary for value in data2">

</select>

模型将设置为 value 对象 - 例如{primary: "white", sub: "white2"}.如果你想将其设置为 "white2"、"black3" 等......然后使用:

ng-options="value.sub as value.sub group by value.primary for value in data2"