Question

我有以下数据：

$scope.allNames = [
    "A": [ { "name": "a1" }, { "name": "a2" }, { "name": "a3"} ],
    "B": [ { "name": "b1" }, { "name": "b2" }, { "name": "b3"} ],
    "C": [ { "name": "c1" }, { "name": "c2" }, { "name": "c3"} ],
]

<div ng-repeat="(letter, names) in allNames | filter:myFilter">
    <h4>{{ letter }}</h4>
    <ul ng-repeat="n in names">
        <li>{{ n.name }}</li>
    </ul>
</div>

// on click show only name for this letter.
<span ng-click="myFilter = ??">A</span>
<span ng-click="myFilter = ??">B</span>
<span ng-click="myFilter = ??">C</span>

我要点击的是<span>A</span>只显示$key: A变量中allNames或以 A 即可。这就是我如何通过数组索引进行过滤的问题。

Answer 1

检查这可能是您的解决方案 - http://jsfiddle.net/Shital_D/vsvxqnq7/4/

单击A，B，C后，将显示相应的数组。

以下是代码：

 angular.module('myApp', [])
     .controller('ExampleController', ['$scope', function($scope) {
         $scope.myFilter = '';
         $scope.allNames = {
             "A": ['name1', 'name2', 'name3'],
             "B": ['name4', 'name5', 'name6'],
             "C": ['name7', 'name8', 'name9']
         };

         $scope.change = function(key) {
             $scope.myFilter = key;
         };

     }]);

HTML -

     <div ng-repeat="(key, value) in allNames" ng-show="myFilter == key">
         <h4>{{ key }}</h4>

        <ul ng-repeat="name in value">
            <li>{{ name }}</li>
        </ul>
    </div>
    <div ng-repeat="(key, value) in allNames" ng-click="change(key)">                 
        {{key}}
    </div>

按键的角度ng重复滤波器数组

1 个答案: