Filter Firebase data using AngularJS

Question

i have a data in firebase like this:

firebase_data {
    -JGc5X37NDuvmJylmx0s: Object {
        name: 'John Doe',
        age: 21
    }
    -JGnGJlTjyAxFT-Vn48Y: Object {
        name: 'Jane Doe',
        age: 22
    }
}

in my controller:

$scope.firebase = $firebase(new Firebase("https://firebase_data.firebaseio.com"));

my view:

<input type="text" ng-model="search" />
<ul ng-repeat="(key, value) in firebase | filter:search">  
    <li><a href="{{ key }}">{{ value.name }}</a></li>
</ul>

the filter is not working. how can i make the filter work?

Filters only work on arrays. Have a look at this 'How to filter (key, value) with ng-repeat in AngularJs?' for workarounds: — Gruff Bunny
– Gruff Bunny, Commented Mar 2, 2014 at 17:10

Kato · Accepted Answer · 2014-03-03 06:33:48Z

10

Use orderByPriority to convert your Firebase object to an array.

<input type="text" ng-model="search" />
<ul ng-repeat="(key, value) in firebase | orderByPriority | filter:search">  
    <li><a href="{{ key }}">{{ value.name }}</a></li>
</ul>

answered Mar 3, 2014 at 6:33

Kato

40.6k6 gold badges124 silver badges149 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jobsamuel Over a year ago

Today, orderByPriority is deprecated, right? I've been trying to use this but it's doesn't work.

Kato Over a year ago

In the latest versions just use $asArray which already provides sorted values.

madhured · Accepted Answer · 2014-03-02 19:39:10Z

2

I think firebase returns as object and angular's filter will filter only arrays and does not filter object

You can create custom filter and filter. I have created example for that using firebase object

http://plnkr.co/edit/tiSsswXQWgAPPv6ozqOm?p=preview

Please let me know if anything

answered Mar 2, 2014 at 19:39

madhured

4432 silver badges8 bronze badges

Collectives™ on Stack Overflow

Filter Firebase data using AngularJS

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related