Javascript 按属性值筛选对象数组

我对角度和可观测性都是新手。 我从一个JSON文件中得到一个产品列表

产品。服务

getProducts(): Observable<Product[]>{
    return this._http.get<Product[]>(this.configUrl); 
}

product.ts

export interface Product {
    "quantity": number;
    "price": string;
    "available": boolean;
    "sublevel_id": number;
    "name": string;
    "id": string;
}

一切正常，但我希望过滤响应，以仅获取

可用==true

我在服务和组件中尝试了一些方法，但都不起作用。我如何以适当的方式实现这一点

代码不工作

this.products = this.products.filter(product => {
  return product.available == true
});



filterProducts(): Observable<Product[]>{

    return this.getProducts()
        .pipe(map(products => products
        .filter(product => product.available === true)));

}

试试这个

let o={“产品”：[
{
“数量”：308，
“价格”：“$8958”，
“可用”：错误，
“子层级id”：3，
“名称”：“aute”，
“id”：“58b5a5b1b6b6c7aacc25b3fb”
},
{
“数量”：891，
“价格”：“$5450”，
“可用”：正确，
“子层级id”：3，
“姓名”：“莫利特”，
“id”：“58b5a5b117bf36cf8aed54ab”
},
{
“数量”：698，
“价格”：“$17001”，
“可用”：错误，
“子层级id”：10，
“名称”：“eiusmod”，
“id”：“58B5A5B18607B1071FB5B”
}
]}
让filtered=o.products.filter（p=>p.available==true）
console.log（过滤）试试这个


let o={“产品”：[
{
“数量”：308，
“价格”：“$8958”，
“可用”：错误，
“子层级id”：3，
“名称”：“aute”，
“id”：“58b5a5b1b6b6c7aacc25b3fb”
},
{
“数量”：891，
“价格”：“$5450”，
“可用”：正确，
“子层级id”：3，
“姓名”：“莫利特”，
“id”：“58b5a5b117bf36cf8aed54ab”
},
{
“数量”：698，
“价格”：“$17001”，
“可用”：错误，
“子层级id”：10，
“名称”：“eiusmod”，
“id”：“58B5A5B18607B1071FB5B”
}
]}
让filtered=o.products.filter（p=>p.available==true）
console.log（过滤）
在
管道中使用过滤器操作符
并执行正常订阅

filterProducts(): Observable<Product[]>{

return this.getProducts()
    .pipe(
       filter(products =>  product.available )
     )

}

filterProducts（）：可观察{
返回此文件。getProducts（）
.烟斗(
过滤器（产品=>product.available）
)
}
在
管道中使用过滤器操作符
并执行正常订阅

filterProducts(): Observable<Product[]>{

return this.getProducts()
    .pipe(
       filter(products =>  product.available )
     )

}

filterProducts（）：可观察{
返回此文件。getProducts（）
.烟斗(
过滤器（产品=>product.available）
)
}
这应该行得通

getProducts(): void{
    this.productsService.getProducts()
        .subscribe(products => this.products = products.filter(product=>product.available==true));
}

这应该行得通

getProducts(): void{
    this.productsService.getProducts()
        .subscribe(products => this.products = products.filter(product=>product.available==true));
}

我收到此错误：
[ts]属性“products”在类型“Product[]”上不存在。[2339]
当尝试访问this.products.productsOk时，此功能正在运行，但它显示Visual Studio代码中存在一个问题，即类型“Product[]上不存在此
[ts]属性“products”。[2339]
但项目编译并运行良好我收到了此错误：
[ts]属性“products”在类型“Product[]”上不存在。[2339]
当尝试访问this.products.productsOk时，此功能正在运行，但它显示Visual Studio代码中存在一个问题，即类型“Product[]上不存在此
[ts]属性“products”。[2339]
但该项目的编译和运行非常完美