2023年6月8日 02:50:56go评论59阅读模式

英文:

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) =&gt; {
        return item.PLN_SVM.some((svm) =&gt; {
          return svm.PLN.some(
            (plan) =&gt; plan.PLAN === parseInt(this.planFilter)
          );
        });
      }).map((item) =&gt; {
        item.PLN_SVM = item.PLN_SVM.filter((svm) =&gt; {
          return svm.PLN.some(
            (plan) =&gt; 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: &quot;Fundsettle&quot;,
PLN_SVM: [
{
SVM: 16111801,
ISIN: &quot;LU0100749679&quot;,
LABEL: &quot;NEKR FD LIFESTYLE DYNAMICC&quot;,
PLN: [
{
CODE: &quot;NEKR01&quot;,
PLAN: 8,
CANAL: &quot;*&quot;,
AV: &quot;A&quot;,
LIB: &quot;Fonds NEKRenta 8&quot;,
DATEV_EFFECTIVE: &quot;0001-01-01&quot;,
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:&quot;FR0010149302&quot;,
LABEL:&quot;CARMIGNAC EMERGENT SC&quot;,
PLN:[
{
CODE:&quot;NEKR01&quot;,
PLAN:8,
CANAL:&quot;*&quot;,
AV:&quot;A&quot;,
LIB:&quot;Fonds NEKRenta 8&quot;,
DATEV_EFFECTIVE:&quot;0001-01-01&quot;,
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:&quot;FR0010149120&quot;,
LABEL:&quot;CARMIGNAC SECURITE C&quot;,
PLN:[
{
CODE:&quot;NEKR01&quot;,
PLAN:4,
CANAL:&quot;*&quot;,
AV:&quot;A&quot;,
LIB:&quot;Fonds NEKRenta 4&quot;,
DATEV_EFFECTIVE:&quot;0001-01-01&quot;,
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:&quot;NEKR01&quot;,
PLAN:4,
CANAL:&quot;*&quot;,
AV:&quot;V&quot;,
LIB:&quot;Fonds NEKRenta 4&quot;,
DATEV_EFFECTIVE:&quot;0001-01-01&quot;,
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: &quot;Euronext Brussels&quot;,
PLN_SVM: [
{
SVM: 836129993,
ISIN: &quot;BE0974314461&quot;,
LABEL: &quot;BALTA GROUP&quot;,
PLN: [
{
CODE: &quot;NEKR01&quot;,
PLAN: 1,
CANAL: &quot;*&quot;,
AV: &quot;A&quot;,
LIB: &quot;Fonds NEKRenta 1&quot;,
DATEV_EFFECTIVE: &quot;0001-01-01&quot;,
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: &quot;NEKR01&quot;,
PLAN: 1,
CANAL: &quot;*&quot;,
AV: &quot;V&quot;,
LIB: &quot;Fonds NEKRenta 1&quot;,
DATEV_EFFECTIVE: &quot;0001-01-01&quot;,
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) =&gt; {
return item.PLN_SVM.some((svm:any) =&gt; {
return svm.PLN.some(
(plan:any) =&gt; plan.PLAN === parseInt(this.planFilter)
);
});
}).map((item:any) =&gt; {
item.PLN_SVM = item.PLN_SVM.filter((svm:any) =&gt; {
return svm.PLN.some(
(plan:any) =&gt; 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.

通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。

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

问题

答案1

答案2

在Angular 16中使用NPM的ng-circle-progress组件的方法是什么？

如何在与表单结合使用时在同步代码之前运行异步代码。

类型保护在分配给布尔值时未被识别 – 严格模式

从Java API中渲染byte[]，作为Angular 2中的图像。

What's the correct way to type hint an empty list as a literal in python?

如何在Highcharts Gantt中更改本地化的星期名称

如何在同一个流中使用多个过滤器和映射函数？

如何使用Map/Set来将代码优化到O(n)？

.NET MAUI Android在GitHub Actions上构建失败，错误代码为1。

如何在Playwright视觉比较中屏蔽多个定位器？

在C++中，可以使用可变模板参数来检索类型的内部类型。

selenium.common.exceptions.StaleElementReferenceException: Message: stale element reference: stale element not found

Creating and opening a URL to log in to Website via Basic Auth with Robot Framework/Selenium (Python)

AG Grid 在上下文菜单中以大文本形式打开

发表评论