I am trying to retrieve data for two different picklists, but using the same service, as you can see here.

Each one of these works fine, but they merge eachother. So printing "businessSectorData" and "data", gives same values, all the values from both of the calls merged in to one array/object. How can I avoid them beeing merged into one array?

x.Component.ts

 public countryPicklist: IPicklistCategories[] = [];
 public businessSectorPicklist: IPicklistCategories[] = [];

 ngOnInit(): void {

    this.CrmService.GetPicklistValues("contact", "country").subscribe({
      next: (data: IPicklistCategories[]) => {
        this.countryPicklist = data;
        console.log(data);
      }
    });
    this.CrmService.GetPicklistValues("contact", "type").subscribe({
      next: (businessSectorData: IPicklistCategories[]) => {
        this.businessSectorPicklist = businessSectorData;
        console.log(businessSectorData);
      }
    });
  }

x.service.ts

 picklistCategories: IPicklistCategories[] = [];
  public GetPicklistValues(entity: string, fieldName: string): any {
    //returns metadata and converts it to array with label and value
    let endpoint = mysecretendpoint;
    return this.get<IPicklistResponse>(endpoint).pipe(
      map((res: IPicklistResponse) => {
        let options = res.GlobalOptionSet.Options;
        options.forEach((data: any) => {
          this.picklistCategories.push({
            "label": data.Label,
            "value": data.Value
          });
        });
        return this.picklistCategories;
      }))
  }

CodePudding user response：

Reset the property to empty string, or create a local variable. The array contains the results of the previous call hence you are getting this issue!

public GetPicklistValues(entity: string, fieldName: string): any {
    this.picklistCategories = []; // or create a local variable called 
   //  const picklistCategories =[]; which will always be empty when function is called!
    //returns metadata and converts it to array with label and value
    let endpoint = mysecretendpoint;
    return this.get<IPicklistResponse>(endpoint).pipe(
      map((res: IPicklistResponse) => {
        let options = res.GlobalOptionSet.Options;
        options.forEach((data: any) => {
          this.picklistCategories.push({
            "label": data.Label,
            "value": data.Value
          });
        });
        return this.picklistCategories;
      }))
  }