如何使用 angular 在 for 循环中使用正确的过滤器

Question

我有这个数组["Let me introduce", "Our Values"]

我使用这段代码：

 var dataname: string[] = item[4].namecategory;
         for (var i = 0; i < dataname.length; i++) {
         console.log(dataname[i]); // output dataname[i] Let me introduce dataname[i] Our Values
         }
    this.CrewChannelContents_category = this.CrewChannelContents.filter(x => x.Category.toLowerCase().includes(dataname[i].toLowerCase()));

显示错误

core.js:15724 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'toLowerCase' of undefined TypeError: Cannot read property 'toLowerCase' of undefined

来自 this.CrewChannelContents 的数据

[
                    {
                        Id: "15",
                        Category: "Our Values,WIDE",
                        Date: new Date('2019-12-02'),
                        
                    },
                    {
                        Id: "17",
                        Category: "Let me introduce",
                        Date: new Date('2019-12-05'),
                    
                    },.....
]

更新代码：

 let tmpVal;
                    for (var i = 0; i < dataname.length; i++) {
                        tmpVal = this.CrewChannelContents.filter(x => x.Category.toLowerCase().includes(dataname[i].toLowerCase()));
                        if (tmpVal) this.CrewChannelContents_category.push(tmpVal)
                        console.log(this.CrewChannelContents_category)
                    }

错误

错误错误：未捕获（承诺）：类型错误：无法读取未定义的属性“推送”类型错误：无法读取未定义的属性“推送”

在过滤线。

请您与我分享任何想法，当我有数据数组时如何过滤？

谢谢你们

更新代码 (2)

for (var i = 0; i < dataname.length; i++) {
                    console.log(this.CrewChannelContents.filter(x => x.Category.toLowerCase().includes(dataname[i].toLowerCase())));
                    this.CrewChannelContents_category = this.CrewChannelContents.filter(x => x.Category.toLowerCase().includes(dataname[i].toLowerCase()));
                    this.tmpvalue.push(this.CrewChannelContents_category);
                    console.log(this.tmpvalue)
                }

得到一个像

Answer 1

看起来您只需要在循环中包含过滤器检查：

export class SomeComponent implements OnInit {
   CrewChannelContents_category: string[];

   ngOnInit() {

        var data = [{
            Id: "15",
            Category: "Our Values,WIDE",
            Date: new Date('2019-12-02'),
        },
        {
            Id: "17",
            Category: "Let me introduce",
            Date: new Date('2019-12-05'),
        }]
    
    
    
        var dataname = ["Let me introduce", "Our Values"];
    
        // reset the CrewChannelContents_category variable
        this.CrewChannelContents_category = [];
        let tmpVal
        for (var i = 0; i < dataname.length; i++) {
            tmpVal = data.filter(x => x.Category.toLowerCase().includes(dataname[i].toLowerCase()));
            if (tmpVal) this.CrewChannelContents_category.push(tmpVal)
        }
    
    }

Answer 2

这是因为您在 i 大于数据名长度的循环外使用 dataname[i]。 因此，对于过滤，您可以使用：

var data = [
  {
    Id: "15",
    Category: "Our Values,WIDE",
    Date: new Date("2019-12-02")
  },
  {
    Id: "17",
    Category: "Let me introduce",
    Date: new Date("2019-12-05")
  }
];
var dataname = ["Let me introduce", "Our Values"];
console.log(
  data.filter((x) =>
    dataname.some((y) => x.Category.toLowerCase().includes(y.toLowerCase()))
  )
);

参考 array.some() 的工作原理： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some