1

I am struggling on a problem.

I receive an array of objects from a get request. Beacause of business logic constraint I can't modify the controller's function that populates my array. So I must eliminate duplicates in my application.

So here is the code :

this.httpClient.get(environment.apiUrl + this.config.getSettings()['cleard']['api']['user']['distribution-zone'], { headers: new HttpHeaders({ 'Authorization': 'BEARER ' + this.auth.getUserSession().access_token })}).subscribe( (arrayDistributionZoneResult: Array<DistributionZoneResult>) => {

console.log('distribution zone result : ' + arrayDistributionZoneResult.length);
      let filteredArray: Array<DistributionZoneResult>;
      for (const obj of arrayDistributionZoneResult) {

      //  here i want to add only object whose property distributionZoneId doesn't exist already in my this.distributionZone new array.

        this.distributionZone.push(obj.distributionZoneId);
      }

My object : DistributionZoneResult is made of 4 properties.

export interface DistributionZoneResult {
  distributionZoneName: string;
  localisedDistributionZoneName: string;
  distributionZoneId: number;
  businessUnitId: number;
}

I need to eliminate 'distributionZoneId' duplicate.

As I am new on angular 6 and rxjs, I have looked for solutions on internet, but none of them solved my problem.

first solution I've tried :

 this.distributionZone = this.distributionZone.filter((el, i, a) => i === a.indexOf(el));

This one doesn't make any change to my array.

Second solution I've tried :

 merge(arrayDistributionZoneResult).distinct((x) => x.distributionZone).subscribe(y => {
          filteredArray.push(y);
          console.log(filteredArray);
        });

I can't use this one because i receive an error on the distinct() function :

error TS2339: Property 'distinct' does not exist on type Observable

So I am kind of lost, because this should't be so hard to just remove duplicate items when these have a particular simililtude. In C# I would do .dinstinct().

Thank you for your expertise. My regards.

here is the solution :

 this.httpClient.get(environment.apiUrl + this.config.getSettings()['cleard']['api']['user']['distribution-zone'], { headers: new HttpHeaders({ 'Authorization': 'BEARER ' + this.auth.getUserSession().access_token })}).subscribe( (arrayDistributionZoneResult: Array<DistributionZoneResult>) => {
      console.log(environment.apiUrl);
      console.log('unfiltered distribution zone result : ' + arrayDistributionZoneResult.length);

      for (const obj of arrayDistributionZoneResult) {
        this.distributionZone.push(obj.distributionZoneId);
        //  console.log('arrayDistribZone : ' + obj.distributionZoneId);
      }

      const distinct = (value, index , self) => {
        return self.indexOf(value) === index;
      };
     this.distributionZone = this.distributionZone.filter(distinct);
      console.log('filtered distribution zone result : ' + this.distributionZone.length);
      console.log('filtered distribution zone result : ' + this.distributionZone);

    });

To use a delegate, and apply the filter on an array of number. Thanks to all of you.

isherwood
  • 58,414
  • 16
  • 114
  • 157
  • https://stackoverflow.com/questions/40858075/how-to-get-unique-array-with-only-filter-in-javascript – secondbreakfast Dec 20 '18 at 16:24
  • 1
    Possible duplicate of [How to get unique array with only filter in Javascript](https://stackoverflow.com/questions/40858075/how-to-get-unique-array-with-only-filter-in-javascript) – tymeJV Dec 20 '18 at 16:24
  • `this.distributionZone = this.distributionZone.filter((e, i, self) => return self.indexOf(z => z.distributionZoneId === e.distributionZoneId) === i)` – tymeJV Dec 20 '18 at 16:25
  • many answers to this question available. One common one is to use lodash and the uniqBy function it provides. lodash is a standard multi tool you'll encounter in most projects. – bryan60 Dec 20 '18 at 16:27
  • Thank you TymeJV and bryan60 and Abos too ....It seems that many solution existed. – Rémi Duplan Dec 20 '18 at 16:41
  • It's not a matter of angular, it's all about JS. You simply filter the existing array like this `distributionZone.filter((e, i) => { return a.indexOf(e) == i });`. This will return unique item from the array. – Unknown User Dec 20 '18 at 16:41

1 Answers1

1

Rxjs way

from(arrayDistributionZoneResult)
.pipe(
  distinct(v=>v.distributionZoneId)
)
...
ABOS
  • 3,723
  • 3
  • 17
  • 23