不打印到浏览器范围元素

Question

我有这个过滤的集合：

this.myForm.get('filterProduct').valueChanges.subscribe(
    value => {
        data.Stores.forEach(filtered => {
            console.log(filtered.Products.filter(val => value.slice(1) >= val['Price']))
            console.log(filtered);
        });
    });

以我的方式打印浏览器：

<ul>
    <li *ngFor="let product of filtered">
        <img src={{product.ProductImage}}>
        <p>Product Price: {{ product.Price }}</p>
        <p>Product Title: {{ product.ProductTitle }}</p> 
    </li>
</ul>

我该如何解决？

Answer 1

在您的模板中，您尝试遍历已过滤的数组，而从您的代码示例中，您似乎没有为此数组指定任何值。

Answer 2

在代码中进行以下更改

this.myForm.get('filterProduct').valueChanges.subscribe(
    value => {
      data.Stores.forEach(filtered => {
        //USE FOLLOWING LINE
        this.filtered = filtered.Products.filter(val => value.slice(1) >= val['Price']);
        this.priceFilter = this.filtered.products; //Add to price filter.
     .
     .
     .