筛选器按钮未组合用于筛选 JSON 的逻辑 - mat-dialog

Question

>我正在尝试创建一个过滤器组件。如果我选择"立即购买"或"私下竞价"，它们将独立工作，但不能合并。如果我的结果启用了"立即购买"和"私下竞价"，那么它将按其中一个进行筛选，但不会同时按两者进行筛选。如何让他们一起工作？

第二个问题，如果我在模态之外单击，控制台会抛出错误，结果是 未定义自订阅((。有没有办法在点击外面不订阅时分辨出角度？

app.component.ts

openFilterDialog(): void {
const dialogRef = this.dialog.open(FiltersComponent, {
panelClass: "dialogBoxStyler",
data: {
posts: this.posts,
buyItNowEnabled: this.buyItNowEnabled,
privateAuctionEnabled: this.privateAuctionEnabled,
auctionTimeType: this.auctionTimeType
}
});
dialogRef
.afterClosed()
.pipe(takeUntil(this.destroy))
.subscribe(result => {
console.log("RESULTS");
console.log(result);
this.posts = result.posts;
this.buyItNowEnabled = result.buyItNowEnabled;
console.log("result is" + result.auctionTimeType);
this.privateAuctionEnabled = result.privateAuctionEnabled;
this.auctionTimeType = result.auctionTimeType;
});
}

filter.component.ts

confirmFilter(
privateAuctionEnabled: boolean,
buyItNowEnabled: boolean,
auctionTimeType: string
) {
this.auctionTimeType = auctionTimeType;
if (auctionTimeType === "Ending Soonest") {
this.filteredPosts = this.posts.sort((n1, n2) => {
if (n1.auctionEndDateTime > n2.auctionEndDateTime) {
return 1;
}
if (n1.auctionEndDateTime < n2.auctionEndDateTime) {
return -1;
}
return 0;
});
}
if (auctionTimeType === "Newly Listed") {
this.filteredPosts = this.posts.sort((n1, n2) => {
if (n1.auctionEndDateTime > n2.auctionEndDateTime) {
return 1;
}
if (n1.auctionEndDateTime < n2.auctionEndDateTime) {
return -1;
}
return 0;
});
}
if (privateAuctionEnabled) {
this.filteredPosts = this.posts.filter(
x => x.auctionType === "privateAuction"
);
}
if (buyItNowEnabled) {
this.filteredPosts = this.posts.filter(
x => x.buyItNow !== "Not Available"
);
}
var filteredItems = {
posts: this.filteredPosts,
buyItNowEnabled: this.buyItNowEnabled,
privateAuctionEnabled: privateAuctionEnabled,
auctionTimeType: this.auctionTimeType
};
this.dialogRef.close(filteredItems);
}

Answer 1

检查buyItNowEnabled和privateAuctionEnabled是否都为真。如果它们为 true，则首先使用buyItNowEnabled情况所需的条件过滤posts并将结果数据存储temp数组中。然后再次使用privateAuctionEnabled情况所需的条件过滤此临时数组的数据，因此此过滤生成的数据将是您的最终答案。