Имам прост етикет <firebase-query> и бих искал да манипулирам някои от данните, преди да ги покажа чрез <dom-repeat>. Например, трябва да превърна някои полета във връзки и също да анализирам някои дати.
И така, трябва да получа данните, след като са готови, да премина през всеки елемент и да променя някои от стойностите.
За да направя това, имам наблюдател на данните, който да открива кога са готови. Не мога обаче да разбера как да превъртя данните от тази JavaScript функция. По някаква причина for(var i in items) не работи, въпреки че елементите съществуват.
Ето компонента:
<dom-module id="cool-stuff">
<template>
<firebase-query id="query" path="/items" data="{{items}}"></firebase-query>
<template is="dom-repeat" items="{{items}}" as="item">
[[item.name]]<br />
[[item.date]]<br />
</template>
</template>
<script>
Polymer({
is: 'ix-table',
properties: {
items: {type: Object, observer: "_itemsChanged"},
}
itemsChanged: function(data) {
// how do I loop through the data received from firebase-query?
console.log(data);
}
});
</script>
</dom-module>
В идеалния случай всичко, което бих искал да направя във функцията наблюдател, е нещо като:
for(var i in data) {
obj = data[i];
obj.name = '<a href="/bg/item/"+obj.key>'+ojb.name+'</a>';
}
Но изглежда не мога да преглеждам данните.
Във функцията наблюдател console.log(data) връща някои странни неща като това:
Array[o]
0: Object (which contains a proper item)
1: Object (same)
2: Object (same)
Актуализация:
Ето екранна снимка на това, което console.log(data) връща (от вътрешността на наблюдателя):
Масивът изглежда е попълнен с всички обекти, но се показва като Array[0]. Така че няма да ми позволи да ги прегледам.
Актуализация 2:
Благодарение на arfost ето решението:
<script>
Polymer({
is: 'ix-table',
properties: {
items: {type: Object},
}
observers: [
'_itemsChanged(items.splices)'
],
_itemsChanged: function(changeRecord) {
if (changeRecord) {
changeRecord.indexSplices.forEach(function(s) {
for (var i=0; i<s.addedCount; i++) {
var index = s.index + i;
var item = s.object[index];
console.log('Item ' + item.name + ' added at index ' + index);
// do whatever needed with the item here:
this.items[index].name = "New name";
}
}, this);
}
},
});
</script>
