[英]Polymer 2.x + Firebase: How to reverse order of iron-list?
I want to display my data in reverse chronological order of how/when it was entered. 我想以与输入时间/时间相反的时间顺序显示数据。 In other words, I want the most recent entries to appear at the top. 换句话说,我希望最新的条目显示在顶部。
I am using Polymerfire <firebase-query>
to fetch data from my Firebase/Polymer app and I am using <iron-list>
to display the data. 我正在使用Polymerfire <firebase-query>
firebase <firebase-query>
从Firebase / Polymer应用程序获取数据,并且正在使用<iron-list>
显示数据。 Currently, the list has the most recent entries at the bottom of the list. 当前,列表在列表底部具有最新条目。
I expect that reversing the order in either <firebase-query>
or <iron-list>
should result in the desired behavior. 我希望在<firebase-query>
或<iron-list>
中颠倒顺序应该会导致所需的行为。 I prefer to accomplish this without using the items.reverse()
method. 我更喜欢在不使用items.reverse()
方法的情况下完成此操作。 Are there any properties or methods native to iron-list
or Polymerfire to accomplish the desired behavior? 是否有iron-list
或Polymerfire固有的特性或方法来实现所需的行为?
<firebase-query
id="query"
app-name="notes"
path="/notes/[[uid]]"
data="{{items}}">
</firebase-query>
<iron-list items="[[items]]">
<template>
<div>
[[item.name]]
</div>
</template>
</iron-list>
<script>
Polymer({
properties: {
uid: String,
items: {
type: Object,
observer: 'itemsChanged'
}
},
itemsChanged: function (newItems, oldItems) {
// do something when the query returns values
}
});
</script>
As far as I know (and could quickly check in the PolymerFire source code for its query
component ) there is nothing built into the library for reversing the items from the database. 据我所知(并可以快速检查其query
组件的PolymerFire源代码 ),库中没有内置任何东西可以从数据库中反转项目。
The remaining option is to add an additional property to your database nodes with the inverted value of the property you want to sort on. 剩下的选项是使用要排序的属性的倒置值将附加属性添加到数据库节点。 So in your case that could be an inverted timestamp: -1 * Date.now()
. 因此,在您的情况下,这可能是倒置的时间戳: -1 * Date.now()
。 If you then sort on this inverted value, the results will show up in descending order of the original timestamp. 如果您随后对该倒置值进行排序,则结果将以原始时间戳的降序显示。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.