Question

在特殊情况下我真的知道这个过滤器只会返回一次，有没有办法以更好的方式做到这一点？也许还有其他指令？

<div ng-repeat="category in product.categories | filter: { name: userChoice }">

http://jsfiddle.net/cjy8o4t1/

这是Javascript

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

function MyCtrl($scope) {

    $scope.userChoice='computers';

    $scope.product=
        {
            id: 'sku908398939',
            categories:[
                {
                    name: 'computers',
                    val: {
                        minQty: 10,
                        maxQty: 100
                    }
                },
                {
                    name: 'hifi',
                    val: {
                        minQty: 20,
                        maxQty: 200
                    }                        
                }

            ]
        }
}

这是观点：

<div data-ng-controller="MyCtrl" ng-app="myApp">

    <select ng-model="userChoice" ng-options="c.name as c.name for c in product.categories">
    </select>

    <div ng-repeat="category in product.categories | filter: { name: userChoice }">
       Min qty for category {{category.name}} is {{category.val.minQty}} units
    </div>

</div>

Answer 1

在这种情况下无需过滤或重复重复。只需使用ng-options功能绑定到对象：

<select ng-model="userChoice" ng-options="c as c.name for c in product.categories">
</select>

现在userChoice是数组中的一个对象：

Min qty for category {{userChoice.name}} is {{userChoice.val.minQty}} units

选中此fiddle

Answer 2

看起来您只是想匹配绑定到下拉列表的对象的信息。只需更改绑定到userChoice对象的方式（绑定整个对象而不仅仅是属性）并显示它。这样你甚至不必自己使用数组。

HTML

<select ng-model="userChoice" ng-options="c as c.name for c in product.categories">
</select>
<div>
    Min qty for category {{userChoice.name}} is {{userChoice.val.minQty}} units
</div>

您还可以将此添加到控制器以更好地默认下拉对象。

$scope.userChoice= $scope.product.categories[0];

Editted fiddle

在这种特殊情况下，有没有办法避免重复重复？

2 个答案: