Ang With JS Group by Count With Filter

时间:2015-10-26 10:03:50

标签: angularjs

<script>
    var myApp = angular.module('myApp', ['angular.filter']);

    myApp.controller("MyController", function ($scope) 
    {
        $scope.movies = 
        [
            { title: 'The Matrix', rating: 7.5, category: 'Action' },
            { title: 'Focus', rating: 6.9, category: 'Comedy' },
            { title: 'The Lazarus Effect', rating: 6.4, category: 'Thriller' },
            { title: 'Everly', rating: 5.0, category: 'Action' },
            { title: 'Maps to the Stars', rating: 7.5, category: 'Drama' }
        ];
    });     

</script>
<div ng-controller="MyController"> 
    <div class="searchBar">
        <input type="text" name="title" ng-model="title" placeholder="Search..." />
    </div>
    <ul class="angularList" ng-repeat="(key, value) in movies  | groupBy: 'category'">
        <h3>{{ key }} ({{ value.length }})</h3>
        <li ng-repeat="movie in value | filter:title">
            <a href="#">{{ movie.title }}</a><br />
            <div class="rating_box">
                <div class="rating" style="width:{{movie.rating*10}}%"></div>
            </div>
        </li>               
    </ul>
</div>  

我想要结果:

行动(2)

The Matrix

艾佛利

喜欢这个 代码将是完美的,只有计数与组和过滤器不完美。任何人都可以提供帮助 因此,主要问题是将过滤器放在类别上。

谢谢, Ajai Pandey

2 个答案:

答案 0 :(得分:2)

您需要将筛选列表的结果存储在别名中:

 <h3>{{ key }} ({{ filteredList.length }})</h3>
 <li ng-repeat="movie in value | filter:title as filteredList">

很好的部分是你可以使用这个变量上面你要过滤的ng-repeat,只要它在你的控制器范围内。

参见 fiddle

答案 1 :(得分:0)

尝试以下代码:

<tr ng-repeat="(key, value) in data">
    <td> {{key}} </td> <td> {{ value }} </td>
</tr>

检查this link以获取有关ng-repeat的文档。