Question

我有这些数据：

{
   "resources":{
      "animals":[
         {
            "id":"1",
            "value":"dog",
            "names":[
               {
                  "id":"1",
                  "value":"Carl"
               },
               {
                  "id":"2",
                  "value":"July"
               }
            ]
         },
         {
            "id":"2",
            "value":"cat",
            "names":[
               {
                  "id":"1",
                  "value":"Peter"
               },
               {
                  "id":"2",
                  "value":"Frank"
               }
            ]
         },
      ]
   }
}

我希望用户选择：首先是动物，然后选择一个名称（过滤动物ID）。 在结果中获取ID。

我想到了这个例子：

<select ng-model="select.id_1" ng-options="a.id as a.value for a in resources.animals">
  <option value="">-- choose animal --</option>
</select>

<select ng-model="select.id_2" ng-options="...">
  <option value="">-- choose name --</option>
</select>

例如（选择猫和弗兰克）：

select = 
{
    id_1: '2',
    id_2: '2'
}

我不知道第二个ng-options中的代码。

在这个例子中有两个级别， n级的情况如何？

Answer 1

ngOptions不支持多维数组。

试试这个：

<select ng-model="select.id_1" ng-options="a.id as a.value for a in resources.animals" ng-change="firstChange()">
  <option value="">-- choose animal --</option>
</select>

<select ng-model="select.id_2" ng-options="...">
  <option value="">-- choose name --</option>
</select>

在JS中，

$scope.firstChange = function(){
  $scope.Subarray = [];
  for(i=0; i<$scope.resources.animals.length; i++){
    if(select.id_1 == $scope.resources.animals[i].id){
      $scope.Subarray = $scope.resources.animals[i].names;
      break;
    }
  }
 }

在第二个ng选项中使用$ scope.Subarray。

这里是similar question, maybe try this too.

Angularjs：ng-options链接

1 个答案: