在ng-options中过滤

Question

我有两个带有ng-options的选择。我想让第二个select遍历所选name的values字段。

我找到的唯一解决方案是选择对象本身，而不仅仅是第一个select中的name字段(类似于d as d.name for d in data)，但为了一致性，我不这么做。

我可以使用一个过滤器或类似的东西来解决这个问题吗？

​

angular.module("App", []).controller("Ctrl", function($scope) {
  $scope.data = [{ 
    name : "john",
    values : ["Hello", "World"]
   }, {
    name : "peter",
    values : ["Bonjour", "le", "monde"]
   }];
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="App" ng-controller="Ctrl">
<label>Name :</label>
<select ng-model="name" ng-options="d.name as d.name for d in data"></select>
<label>Value :</label>
<select ng-model="value" ng-options="d as d for d in data"></select>
</div>

​

Answer 1

像这样吗？

​

angular.module("App", []).controller("Ctrl", function($scope) {
  $scope.data = [{ 
    name : "john",
    values : ["Hello", "World"]
   }, {
    name : "peter",
    values : ["Bonjour", "le", "monde"]
   }];
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="App" ng-controller="Ctrl">
<label>Name :</label>
<select ng-model="name" ng-options="d.name for d in data"></select>
<label>Value : </label>
<select ng-model="value" ng-options="d as d for d in name.values"></select>
</div>

​

Answer 2

我不确定是否有更好的方法，但这是一个可行的方法：

​

angular.module("App", []).controller("Ctrl", function($scope) {
  $scope.data = [{ 
    name : "john",
    values : ["Hello", "World"]
   }, {
    name : "peter",
    values : ["Bonjour", "le", "monde"]
   }];
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="App" ng-controller="Ctrl">
<label>Name :</label>
<select ng-model="name" ng-options="d.name as d.name for d in data"></select>
<label>Value :</label>
<select ng-model="value" ng-repeat="d in data" ng-if="name === d.name" ng-options="val for val in d.values"></select>
</div>

​