angular.filter groupBy and toArray and fuzzy

Question

I'm utilizing the following library in AngularJS... angular.filter and I'm trying to ng-repeat on the following structure.

When I combine all three directives... groupBy, toArray: true, and fuzzy: search I get the following screen shot...

If I use just groupBy and toArray I the page renders properly..

<div class="grid" ng-repeat="(key, items) in schedule[0] | toArray: true | groupBy: 'bid'">
    <div class="grid__column--12">
        <h3 class="barber-name">{{key}}</h3>
        {{key | json}}
        <div class="card">
            <div class="card__content">
                <ul class="list list--unstyled" ng-repeat="item in items">
                    <li class="list__item">{{item.name}}</li>
                </ul>
            </div>
        </div>
    </div>
</div>

The code above don't have the fuzzy: search which allows the page to render properly.

How can I make all three work together groupBy, toArray: true, and fuzzy: search?

score 0 · Answer 1 · answered Mar 06 '17 at 23:27

I solve the problem with the following code...

<div class="grid" ng-repeat="(key, items) in schedule[0] | toArray: true | groupBy: 'bid' | searchField: 'bid' | filter: search">
    <div class="grid__column--12">
        <h3 class="barber-name">{{items[0].bid}}</h3>
        <!--{{key | json}} {{items | json}}-->
        <div class="card">
            <div class="card__content">
                <ul class="list list--unstyled" ng-repeat="item in items">
                    <li class="list__item">{{item.name}}</li>
                </ul>
            </div>
        </div>
    </div>
</div>

I was missing the index [0] in the following line of code <h3 class="barber-name">{{items[0].bid}}</h3>

angular.filter groupBy and toArray and fuzzy

1 Answers1