gpt4 book ai didi

javascript - Ionic 3 - 从用户排序的数组中过滤列表

转载 作者:行者123 更新时间:2023-11-30 19:56:11 28 4
gpt4 key购买 nike

我正在使用 Ionic 和 Firebase 开发一个应用程序,它需要将用户生成的数组与 Firebase 中的数组进行比较以过滤产品列表。

有一个包含 3 个项目(A、B 和 C)的列表,用户可以重新排序。此顺序应用于从另一个列表中过滤产品,这些产品具有特征 A、B 和 C,具有分数并按降序排序。

所以我需要比较用户所做的排序,并且只产生具有相同排序的产品。例如,如果用户对 B、A、C 进行排序,则结果中只会显示具有相同排序顺序的产品。这意味着 A = 50、B = 100、C = 30 的产品将具有数组 desOrder = [B, A, C]

Firebase 是这样的:

- XMnL8KVlJXXXXXXXXXX
name: "Product 1"
- desOrder
0: "B"
1: "A"
2: "C"
- XMnX2KVlJXXXXXXXXXX
name: "Product 2"
- desOrder
0: "C"
1: "B"
2: "A"
- XnP33RRmNXXXXXXXXXX
name: "Product 3"
- desOrder
0: "A"
1: "C"
2: "B"

搜索.html

<ion-list no-lines>
<ion-item-group class="reordenar" reorder="true" (ionItemReorder)="reorderItem($event)">
<ion-item *ngFor="let item of orderItems">
{{ item }}
</ion-item>
</ion-item-group>
</ion-list>

搜索.ts

orderItems: any;

constructor(public navCtrl: NavController, public navParams: NavParams) {
this.orderItems = ["A", "B", "C"];
}

reorderItem(indexes){
this.orderItems = reorderArray(this.orderItems, indexes);
console.log(this.orderItems); // can be, e.g., ["B", "C", "A"]
}

searchTo(){
this.navCtrl.push(ListPage, {this.orderItems});
}

现在,我将退回所有产品,不带任何过滤器:

列表.ts

products: any;

constructor(public navCtrl: NavController, public navParams: NavParams, public listservice: ListService) {
this.getaData();
}

getaData(){
this.products = this.listservice.getAll();
}

列表服务.ts

getAll(){
return this.db.list('product/').snapshotChanges()
.map(changes =>{
return changes.map(c=> {
const data = c.payload.val();
const id = c.payload.key;
return { id, ...data };;
});
})
}

重要的是顺序,因为所有产品都具有 3 个特征及其分数(在 this question 上不一样)

最佳答案

如果您尝试过滤以仅显示具有相同订单的项目,请为具有该订单的每个项目添加一个属性。因此,在您的示例中:["B", "C", "A"],这将成为属性 "itemOrder": "BCA"

有了它,您现在可以过滤此属性:ref.orderByChild("itemOrder").equalTo("BCA")

因为我认为这可能已经是您的 desOrder 属性的目的,您也可以考虑将其从数组更改为字符串。

关于javascript - Ionic 3 - 从用户排序的数组中过滤列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53962775/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com