Typescript过滤器在Angular中返回一个空数组

Question

我在 Angular 中有一个过滤函数，它返回一个空数组。我知道以前有人问过类似的问题，我已经尝试了所有这些问题，但都失败了。该功能本身似乎是正确的。任何帮助将不胜感激。

gifts 是一个礼品对象数组（见下文）

打字稿：

export class DetailsPageComponent implements OnInit {

  
  gifts: Array<Gift> = [ ... ]
  id: number
  currentGift: any

  constructor(private currentRoute: ActivatedRoute) { }

  ngOnInit(): void {

    this.currentRoute.paramMap.subscribe((params: ParamMap) => {
      this.id = +params.get('id')
      
      this.currentGift = this.gifts.filter(gift => {
        gift.id == this.id
      })
    })
  }

}

礼物对象：

{
name: 'giftName',
id: 22,
}

UPDATE 将 gift.id == this.id 更改为 gift.id == 22 确实返回一个值。这意味着 this.id 没有被正确获取。不知道为什么...有什么想法吗？

Answer 1

过滤功能

this.currentGift = this.gifts.filter(gift => {
    gift.id == this.id
})

不返回任何内容。它必须返回一个布尔值：

this.currentGift = this.gifts.filter(gift => gift.id === this.id)

这是一个例子：

const gifts = [{
    name: 'giftName',
    id: 22,
}];

const id = +'22';

const currentGift = gifts.filter(gift => gift.id === id);

console.log(currentGift);

您必须使用localhost:4200/details-page/11 之类的网址而不是localhost:4200/details-page/:11，否则params.get('id') 将设置为':11'，并且此字符串显然无法转换为数字。