Метод фильтра Возвращает пустой массив в угловых 6

Question

Я создал простой компонент продукта в Angular 6. Когда пользователь щелкает по определенной категории продукта, он фильтрует этот продукт для пользователя.

 subscriptionCat: Subscription;
 filterdProduct: any[];
 products: any[] = [];
 categories: any[];
 category: string;

ngOnInit() {

 this.productService.getAll().pipe(switchMap(prodData => {
   this.products = prodData;
   console.log(this.products);
   return this.route.queryParamMap
    })).subscribe(params => {
       this.category = params.get('category');
       this.filterdProduct = (this.category) ?
       this.products.filter(p => { p.category === this.category }) : this.products;
  });


 this.subscriptionCat = this.categoryService.getCategories()
 .subscribe(catData => {
   this.categories = catData;
  });

}

когда я нажимал на категорию в шаблоне HTML, метод this.product.filter возвращает пустой массив. Я проверил переменные условия фильтра (p.category === this.category), и он работает нормально. Если нет подходящей категории, она должна возвращать массив продуктов по умолчанию в filterdProduct, даже если это не работает вообще.

Answer 1

Проблема в том, что метод фильтра ожидает возвращаемого значения, а вы ничего не возвращаете.

Есть два способа исправить это, оба делают одно и то же.

filter(p => p.category === this.category)

или

filter(p => { return p.category === this.category; })

Answer 2

Решением для этого является удаление фигурных скобок внутри filter метода, потому что по умолчанию Javascript использует фигурные скобки как блок кода, а не как объект.