如何对Polymer 1.0中的铁清单排序? [英] How to sort an iron-list in Polymer 1.0?
问题描述
我正在寻找对铁清单中的数据进行排序(以及对添加到数据数组中的项目进行排序).
I am looking to sort data in an iron-list (and also sort items as they are added into the data array).
样本(未排序)json数据:
Sample (unsorted) json data:
[
{"name": "Zebra"},
{"name": "Alligator"},
{"name": "Lion"}
]
我尝试使用indexAs
属性对iron-list
进行如下排序,但是 API 不清楚如何使用它:
I have tried using the indexAs
property to sort an iron-list
as follows but the API isn't clear how to use it:
<iron-ajax url="./data.json" last-response="{{data}}" auto></iron-ajax>
<iron-list items="[[data]]" as="item" index-as="name" class="fit">
<template>
<div>
Name: <span>[[item.name]]</span>
</div>
</template>
</iron-list>
推荐答案
我不确定是否有更多本机的 Polymer 方法,但是构建排序逻辑并不复杂你自己.
I'm not exactly sure if there's more native Polymer way to do this, but it's not too complex to build the sorting logic yourself.
这个想法是监听response
事件,对服务中的数据进行排序,然后将iron-list
的items
绑定到sortedData
.
The idea is to listen to the response
event, sort the data from the service and then bind the items
of the iron-list
to the sortedData
.
您将需要在iron-ajax
中添加on-response="_onResponseReceived"
.然后,只需对返回的数据进行排序即可.
You will need to add on-response="_onResponseReceived"
to your iron-ajax
. And then it's just a matter of sorting the returned data.
_onResponseReceived: function () {
this.sortedData = this.data.sort(this._compare);
},
_compare: function (a, b) {
if (a.name < b.name)
return -1;
if (a.name > b.name)
return 1;
return 0;
}
当然iron-list
现在需要更新为
<iron-list items="[[sortedData]]" ...>
这篇关于如何对Polymer 1.0中的铁清单排序?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!