CODEWITHSUNDEEP
angularjs
Ajai
Ajai

Reputation: 103

Angular JS Group by Count With Filter

<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>

I want result :

Action (2)

The Matrix

Everly

Like this The code will be perfect, only count is not perfect with group and filter. can any guys help. So main problem is placing the filter over category.

Thanks, Ajai Pandey

Upvotes: 1

Views: 1543

Answers (2)

Ashokreddy
Ashokreddy

Reputation: 352

try this below code:

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

check this link for the documentation on ng-repeat.

Upvotes: 0

Michel
Michel

Reputation: 28269

You need to store the result of the filtered list in an alias:

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

The nice part is that you can use this variable above the ng-repeat where you are filtering, as long as it is in the scope of your controller.

See fiddle

Upvotes: 3

Related Questions