筛选器在我清除输入值时不再起作用。

huangapple go评论67阅读模式
英文:

The filter no longer works when I clear the input value

问题

以下是HTML表格的想法,其中有一个输入框,可以用于筛选计划。

我输入例如值 => 1

筛选有效

我删除值(1)

所有记录都显示,我有4个记录

我尝试值 4

我删除值 4

我有2个记录 ????

我不明白问题在哪?

todo.component.ts

filterByPlan() {
    if (this.planFilter) {
        this.tarificationTitre = this.todoService.PLN_PLC.filter((item) => {
            return item.PLN_SVM.some((svm) => {
                return svm.PLN.some(
                    (plan) => plan.PLAN === parseInt(this.planFilter)
                );
            });
        }).map((item) => {
            item.PLN_SVM = item.PLN_SVM.filter((svm) => {
                return svm.PLN.some(
                    (plan) => plan.PLAN === parseInt(this.planFilter)
                );
            });
            return item;
        });
    } else {
        this.tarificationTitre = this.todoService.PLN_PLC;
    }
}

todo.service.ts

export class TodoService {

   PLN_PLC = [
      {
        PLACECODE: 26,
        PLACELABEL: "Fundsettle",
        PLN_SVM: [
          {
            SVM: 16111801,
            ISIN: "LU0100749679",
            LABEL: "NEKR FD LIFESTYLE DYNAMICC",
            PLN: [
              {
                CODE: "NEKR01",
                PLAN: 8,
                CANAL: "*",
                AV: "A",
                LIB: "Fonds NEKRenta 8",
                DATEV_EFFECTIVE: "0001-01-01",
                PLAGE: [
                  {
                    BORNE: 9999999999999.99,
                    FRAIS_BORDEREAU: 0.00,
                    FRAIS_RETRAIT: 0.00,
                    TYPE_COURTAGE: 1,
                    COURTAGE: 0.00,
                    MIN_COURTAGE: 0.00,
                    TYPE_FRAIS_ETR: 1,
                    FRAIS_ETRANGERS: 2.00,
                    MIN_FRAIS_ETR: 0.00
                  },
                  // 其他数据...
                ]
              },
              // 其他数据...
            ]
          },
          // 其他数据...
        ]
      },
      // 其他数据...
    ];

  constructor() {}
  
}

筛选器必须根据变量 PLAN 进行筛选。如果您有想法,我非常感兴趣,因为我真的想了解问题出在哪里。

我还在Stackblitz上做了一个示例。

英文:

Here is an idea of the HTML table with an input that will filter the plans.

筛选器在我清除输入值时不再起作用。

I enter for example the value => 1

The filter works

筛选器在我清除输入值时不再起作用。

I delete the value (1)

all recordings are displayed, I have 4 recordings

筛选器在我清除输入值时不再起作用。

I try the value 4

筛选器在我清除输入值时不再起作用。

I delete the value 4

I have 2 recordings ????

筛选器在我清除输入值时不再起作用。

I don't understand the problem ?

todo.component.ts

filterByPlan() {
    if (this.planFilter) {
      this.tarificationTitre = this.todoService.PLN_PLC.filter((item) => {
        return item.PLN_SVM.some((svm) => {
          return svm.PLN.some(
            (plan) => plan.PLAN === parseInt(this.planFilter)
          );
        });
      }).map((item) => {
        item.PLN_SVM = item.PLN_SVM.filter((svm) => {
          return svm.PLN.some(
            (plan) => plan.PLAN === parseInt(this.planFilter)
          );
        });
        return item;
      });
    } else {
      this.tarificationTitre = this.todoService.PLN_PLC;
    }
  }

todo.service.ts

export class TodoService {
PLN_PLC = [
{
PLACECODE: 26,
PLACELABEL: "Fundsettle",
PLN_SVM: [
{
SVM: 16111801,
ISIN: "LU0100749679",
LABEL: "NEKR FD LIFESTYLE DYNAMICC",
PLN: [
{
CODE: "NEKR01",
PLAN: 8,
CANAL: "*",
AV: "A",
LIB: "Fonds NEKRenta 8",
DATEV_EFFECTIVE: "0001-01-01",
PLAGE: [
{
BORNE: 9999999999999.99,
FRAIS_BORDEREAU: 0.00,
FRAIS_RETRAIT: 0.00,
TYPE_COURTAGE: 1,
COURTAGE: 0.00,
MIN_COURTAGE: 0.00,
TYPE_FRAIS_ETR: 1,
FRAIS_ETRANGERS: 2.00,
MIN_FRAIS_ETR: 0.00
},
{
BORNE: 0.00,
FRAIS_BORDEREAU: 0.00,
FRAIS_RETRAIT: 0.00,
TYPE_COURTAGE: 0,
COURTAGE: 0.00,
MIN_COURTAGE: 0.00,
TYPE_FRAIS_ETR: 0,
FRAIS_ETRANGERS: 0.00,
MIN_FRAIS_ETR: 0.00
},
{
BORNE: 0.00,
FRAIS_BORDEREAU: 0.00,
FRAIS_RETRAIT: 0.00,
TYPE_COURTAGE: 0,
COURTAGE: 0.00,
MIN_COURTAGE: 0.00,
TYPE_FRAIS_ETR: 0,
FRAIS_ETRANGERS: 0.00,
MIN_FRAIS_ETR: 0.00
},
{
BORNE: 0.00,
FRAIS_BORDEREAU: 0.00,
FRAIS_RETRAIT: 0.00,
TYPE_COURTAGE: 0,
COURTAGE: 0.00,
MIN_COURTAGE: 0.00,
TYPE_FRAIS_ETR: 0,
FRAIS_ETRANGERS: 0.00,
MIN_FRAIS_ETR: 0.00
},
{
BORNE: 0.00,
FRAIS_BORDEREAU: 0.00,
FRAIS_RETRAIT: 0.00,
TYPE_COURTAGE: 0,
COURTAGE: 0.00,
MIN_COURTAGE: 0.00,
TYPE_FRAIS_ETR: 0,
FRAIS_ETRANGERS: 0.00,
MIN_FRAIS_ETR: 0.00
}
]
},
]
},
{
SVM:37906990,
ISIN:"FR0010149302",
LABEL:"CARMIGNAC EMERGENT SC",
PLN:[
{
CODE:"NEKR01",
PLAN:8,
CANAL:"*",
AV:"A",
LIB:"Fonds NEKRenta 8",
DATEV_EFFECTIVE:"0001-01-01",
PLAGE:[
{
BORNE:9999999999999.99,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:1,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:1,
FRAIS_ETRANGERS:2.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
}
]
},
]
},
{
SVM:135045622,
ISIN:"FR0010149120",
LABEL:"CARMIGNAC SECURITE C",
PLN:[
{
CODE:"NEKR01",
PLAN:4,
CANAL:"*",
AV:"A",
LIB:"Fonds NEKRenta 4",
DATEV_EFFECTIVE:"0001-01-01",
PLAGE:[
{
BORNE:9999999999999.99,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:1,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:1,
FRAIS_ETRANGERS:1.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
}
]
},
{
CODE:"NEKR01",
PLAN:4,
CANAL:"*",
AV:"V",
LIB:"Fonds NEKRenta 4",
DATEV_EFFECTIVE:"0001-01-01",
PLAGE:[
{
BORNE:9999999999999.99,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:1,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:1,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
},
{
BORNE:0.00,
FRAIS_BORDEREAU:0.00,
FRAIS_RETRAIT:0.00,
TYPE_COURTAGE:0,
COURTAGE:0.00,
MIN_COURTAGE:0.00,
TYPE_FRAIS_ETR:0,
FRAIS_ETRANGERS:0.00,
MIN_FRAIS_ETR:0.00
}
]
}
]
},
]
},
{
PLACECODE: 1,
PLACELABEL: "Euronext Brussels",
PLN_SVM: [
{
SVM: 836129993,
ISIN: "BE0974314461",
LABEL: "BALTA GROUP",
PLN: [
{
CODE: "NEKR01",
PLAN: 1,
CANAL: "*",
AV: "A",
LIB: "Fonds NEKRenta 1",
DATEV_EFFECTIVE: "0001-01-01",
PLAGE: [
{
BORNE: 9999999999999.99,
FRAIS_BORDEREAU: 0.00,
FRAIS_RETRAIT: 0.00,
TYPE_COURTAGE: 1,
COURTAGE: 0.00,
MIN_COURTAGE: 0.00,
TYPE_FRAIS_ETR: 1,
FRAIS_ETRANGERS: 0.25,
MIN_FRAIS_ETR: 0.00
}
]
},
{
CODE: "NEKR01",
PLAN: 1,
CANAL: "*",
AV: "V",
LIB: "Fonds NEKRenta 1",
DATEV_EFFECTIVE: "0001-01-01",
PLAGE: [
{
BORNE: 9999999999999.99,
FRAIS_BORDEREAU: 0.00,
FRAIS_RETRAIT: 0.00,
TYPE_COURTAGE: 1,
COURTAGE: 0.00,
MIN_COURTAGE: 0.00,
TYPE_FRAIS_ETR: 1,
FRAIS_ETRANGERS: 0.00,
MIN_FRAIS_ETR: 0.00
}
]
}
]
}
]
}
];
constructor() {}
}

The filter must filter on the variable PLAN

If you have an idea, I'm really interested, because I really want to understand where the problem is.

I also made an illustration on Stackblitz.

答案1

得分: 1

以下是翻译好的部分:

检查这个它将会工作

filterByPlan() {
  if (this.planFilter) {
    this.tarificationTitre = JSON.parse(JSON.stringify(this.todoService.PLN_PLC)).filter((item: any) => {
      return item.PLN_SVM.some((svm: any) => {
        return svm.PLN.some(
          (plan: any) => plan.PLAN === parseInt(this.planFilter)
        );
      });
    }).map((item: any) => {
      item.PLN_SVM = item.PLN_SVM.filter((svm: any) => {
        return svm.PLN.some(
          (plan: any) => plan.PLAN === parseInt(this.planFilter)
        );
      });
      return item;
    });
  } else {
    this.tarificationTitre = this.todoService.PLN_PLC;
  }
}

我现在只是进行了一些深拷贝
你直接访问了主数组数据存储在todo服务中),这使得对数组进行一些更改但这会导致错误的数据

希望这能够正常工作

注意:上面的翻译中代码部分没有翻译,只翻译了注释和非代码的内容。如果您需要更多翻译,请提出具体要求。

英文:

check this one it will work

  filterByPlan() {
if (this.planFilter) {
this.tarificationTitre = JSON.parse(JSON.stringify( this.todoService.PLN_PLC)).filter((item:any) => {
return item.PLN_SVM.some((svm:any) => {
return svm.PLN.some(
(plan:any) => plan.PLAN === parseInt(this.planFilter)
);
});
}).map((item:any) => {
item.PLN_SVM = item.PLN_SVM.filter((svm:any) => {
return svm.PLN.some(
(plan:any) => plan.PLAN === parseInt(this.planFilter)
);
});
return item;
});
} else {
this.tarificationTitre = this.todoService.PLN_PLC;
}

}

I just do some deep copy for now
you are accessing main array data(which stored in todo service) directly which
making some changes in that array and it reflcting wrong data.

Hope this will work

答案2

得分: 1

filterByPlan()函数中,我认为你正在用匹配当前筛选条件的值覆盖服务中每个位置定义的PLN_SVM对象。

英文:

Within filterByPlan(), I think you are overwriting the PLN_SVM objects of each location defined within the service with the values which match the current filter.

huangapple
  • 本文由 发表于 2023年6月8日 02:50:56
  • 转载请务必保留本文链接:https://go.coder-hub.com/76426263.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定