从 Observable 返回一个属性作为 Rxjs 中的 Observable Angular

Question

我是 angular 和 Observables 的新手。我的休息 API 总是 return 自定义响应类型

 export class CustomApiResponse {
      isSucess: boolean | undefined; //  denotes whether request was sucess
      statusCode: number | undefined; //  custom status codes from webapi 
      error: string | undefined;      // error message in case of error
      value: any;                 //data which may be array of object or single object
    }

我正在为所有 httprequest 提供通用服务

export class HttpHelperService {
  BaseUrl:String="mydominurl/api";
  constructor( private httpclient :HttpClient) { }

   GetData(url:string) : Observable<CustomApiResponse>{
    return  this.httpclient.get<CustomApiResponse>(this.BaseUrl+url);
   }
  }

现在我需要调用此 httphelper 并使用我的服务从响应中提取可观察到的数据，如下所示（我无法弄清楚）

export class CategoryService {
  url:String="/api_category";
  constructor( private httphelper :HttpHelperService) {  }

   getCategories(url:string) : Observable<Category[]>{   

     this.httphelper.GetData(url).subscribe(val=>{
      if(val.isSucess){ 
     return val.value; //How to do this
     }} );  }

}

请告诉我如何重写上面的方法，以便我可以从我的组件中调用上面的服务，如下所示

export class CategoryListComponent implements OnInit {

  Items: Observable< Category[]> | undefined;
  url:string="/Api_category";
  constructor( private catservice :CategoryService) {
  }

  ngOnInit(): void {
    this.catservice.getCategories(this.url).subscribe(val=> this.Items=val);
  }
}

Answer 1

我认为您要做的是在收到 HttpHelper 的回复后修改提供给 CategoryListComponent 的值。

这可以使用 map 运算符来完成，如下所示：

export class CategoryService {
  url:String="/api_category";
  constructor( private httphelper :HttpHelperService) {  }

   getCategories(url:string) : Observable<Category[]>{   
     return this.httphelper.GetData(url).pipe(map((val) => val.isSuccess ? val.value : []));
   }

}

这将 return 一个新的可观察对象，它将 GetData 的响应值更改为其他值（在本例中，如果 val.isSuccess 为真，则 val.value，否则一个空列表）。

然后您的组件将要订阅并且它将正常工作。

始终尝试将订阅 Observable 作为一长串 Observable 的最后一步。这将需要大量学习 RxJS，但这是正确的方法，理想情况下，您将让您的组件订阅可观察对象，其余的中间服务将映射、过滤、转换或组合信息。

从 Observable 返回一个属性作为 Rxjs 中的 Observable Angular

Returning a Property from Observable as Observable in Rxjs Angular

angular

rxjs

observable

angular-httpclient

rxjs-observables

从 Observable 返回一个 属性 作为 Rxjs 中的 Observable Angular

Returning a Property from Observable as Observable in Rxjs Angular

angular

rxjs

observable

angular-httpclient

rxjs-observables

从 Observable 返回一个属性作为 Rxjs 中的 Observable Angular