Question

使用独特过滤器时，如何设置ng-repeat的选定值？

<div ng-controller="myAppList">
    <select ng-model="query" ng-options="c.cat as c.cat for c in products | unique:'cat'">
        <option value="0">Default</option>
    </select>

    <ul>
        <li ng-repeat="c in products | filter:{cat:query}">
            {{c.name}}
        </li>
    </ul>
</div>

应用：

myApp.controller('myAppList', function myAppList($scope) {
  $scope.products = [
    {'name': 'Product 1', 'cat':'Cat 1',id:1},
    {'name': 'Product 2', 'cat':'Cat 2',id:2},
    {'name': 'Product 3', 'cat':'Cat 2',id:3},
    {'name': 'Product 4', 'cat':'Cat 3',id:4},
    {'name': 'Product 5', 'cat':'Cat 3',id:5},
    {'name': 'Product 6', 'cat':'Cat 2',id:6},
  ];

let index = $scope.products.map(function (x) { return x.id; }).indexOf(5);
console.warn(index);
    $scope.query=$scope.products[index];
});

这是小提琴：http://jsfiddle.net/068pm0uh/3/

Answer 1

你几乎没事。

$scope.query=$scope.products[index].cat;
                                    ^^^

使用unique过滤器，您指定cat作为要过滤的属性，因此您必须设置的$scope.query值应为相应的cat值。

https://jsfiddle.net/j2uwqgz3/

使用唯一过滤器在ng-options中选择的集合

1 个答案: