I try to use firebase-collection, but whatever I try I always receive an empty array (in firebase I have a couple of entries)
<dom-module id="bar-foo">
<template>
<firebase-collection
id="barFoo"
location="https://bar-foo.firebaseio.com/items"
data="{{items}}"></firebase-collection>
<firebase-document location="https://bar-foo.firebaseio.com/item"
data="{{item}}"></firebase-document>
</template>
<script>
class BarFoo {
beforeRegister() {
this.is = 'bar-foo';
this.properties = {
items: {
notify: true,
observer: 'updated',
type: Array
}
}
}
updated(newList) {
// newList === this.items === []
...
}
}
Polymer(BarFoo);
</script>
</dom-module>
the firebase-document
element works! Any suggestions why I receive an empty list ?
Furthermore, when I manually add a new item to the firebase-collection I get the following in the console
this.$.barfoo.add('aaaa')
firebase-query-behavior.html:182 Adding new item to collection with value: aaaa
firebase-query-behavior.html:182 Firebase Event: "child_added" aaaa null
U {k: Yh, path: L, n: ae, lc: false}
And nothing happens in firebase :(
Don't use an observer. When I played around, I found that the observer only ever fires once: on first load. I can't tell you why.
Fortunately, firebase-collection fires events when data changes: https://github.com/GoogleWebComponents/firebase-element/issues/86
Add event listeners instead of property observers:
this.listeners = {
'barFoo.firebase-value': 'updated'
}
This example from PolymerLabs uses event listeners instead of observers: https://github.com/PolymerLabs/todo-list/blob/master/app/elements/todo-data/todo-data.html
Hopefully this helps, and I'll keep looking for some explanation on observer behavior for firebase-collection.