更改可观察值的输出值

时间:2020-07-07 07:56:33

标签: angular

我想从我的API中检索一个值。 当前返回的值是一个对象数组。

[
    {
        "products_id": 793781
    },
    {
        "products_id": 794543
    }
]

我想使用此数据将其转换为数字,从而显示返回的products_id的数量。

我认为该方法将是.length(),但我不知道将其放置在何处。

@Input() archiveVente: [];

ngOnInit() {
    this.ArchiveVente$ = this.dataMlsService.getProducts('Archive', 'Vente');
    console.log(this.ArchiveVente$);
}


getProducts(status, typeTransac):Observable<any> {
    //   console.log(this.baux);
    //   for(this.i=0; this.i<9;this.i++ ){
    let params = new HttpParams();

    params = params.append('status', status);
    params = params.append('typeTransac', typeTransac);

    return this.apiClient.get(this.ApiUrl, { params: params});                
}


<app-compteur [archiveVente]="ArchiveVente$ | async"></app-compteur>

3 个答案:

答案 0 :(得分:2)

从第一个(archiveVente$)开始创建第二个可观察的对象,并使用map运算符,获取在内部发射的数组的长度。

  this.productsCount$ = this.ArchiveVente$.pipe(
    map(products => products?.length)
  );

但是要使其正常工作,您应该更正getProducts的返回类型:

getProducts(status, typeTransac):Observable<Product[]> {
  let params = new HttpParams();
  params = params.append('status', status);
  params = params.append('typeTransac', typeTransac);

  return this.apiClient.get<Product[]>(this.ApiUrl, { params: params});
}

并创建Product类型。

答案 1 :(得分:0)

HttpParams不适用于传递参数。很简单

getProducts(status, typeTransac):Observable<any> {
          const data={status:status,typeTransac:typeTransac}
          return this.apiClient.get(this.ApiUrl,data).pipe(
               map((res:any[])=>{
              //here you has the response, the array, what do you want to do with this?
              //return an object with data and count?
              return {data:res,count:res.length}
              //return only the count?
              return res.length
          }));
           
        }

答案 2 :(得分:0)

当您想到将转换值转换为其他 map 时,它就是rxjs函数。 它将您的数据从一种形状转换为另一种形状。

所以简单地说“你有一个数组,你要它的长度而不是那个数组”

this.productsCount$ = this.ArchiveVente$.pipe(
    map(array => array.length)
  );
相关问题