0

I have an angular 6 project and I am trying to remove duplicate entries from an array.

I have read a number of posts on here about using filter, set, spread operators etc. but the answers in these posts are not filtering out the duplicates.

However everyone one of those methods does not seem to be removing the duplicates.

Appreciate any guidance on why this may be the case, I must be missing something about what these methods are doing.

Methods Tried

ES6 SET Method

this.newBoardMembers = [].concat.apply([], this.newBoardMembers);
      console.log('Consolidated Members: ', this.newBoardMembers);

      this.unique_array = Array.from(new Set(this.newBoardMembers));
      console.log('Unique Array: ', this.unique_array);

FILTER METHOD

this.newBoardMembers = [].concat.apply([], this.newBoardMembers);
      console.log('Consolidated Members: ', this.newBoardMembers);

      this.unique_array = this.newBoardMembers.filter(function(elem, index, self) {
        return index === self.indexOf(elem);
      });
      console.log('Unique Array: ', this.unique_array);

RESULTS

Before Filter or Set Methods

[ { "id": "NI2eyJAZBFYlEE7F5WOfqXpF9ky1", "name": "craig.cocker@mibusiness.com", "avatar": "https://www.listchallenges.com/f/items/83a48b8e-d8ba-4381-9f6b-a239aa0e50f2.jpg" }, { "id": "fL3KY51ooyUc4mP3mobYix1uTJG2", "name": "craig.cocker@bytes.ae", "avatar": "https://cdn.famousoutfits.com/wp-content/uploads/2015/01/matt-bomer.png" }, { "id": "rWdVaf9lN7dl5rdAlZSh", "name": "nevillerob@me.com", "avatar": "https://image.tmdb.org/t/p/original/hErUwonrQgY5Y7RfxOfv8Fq11MB.jpg" }, { "id": "zVUtlx45vKgwcGDaaALaPT36x5f2", "name": "craig.cocker@gmail.com", "avatar": "https://i.pinimg.com/736x/28/0b/81/280b81785d7ba3ae8f993a94866021cf--william-levi-profile-pics.jpg" }, { "id": "NI2eyJAZBFYlEE7F5WOfqXpF9ky1", "name": "craig.cocker@mibusiness.com", "avatar": "https://www.listchallenges.com/f/items/83a48b8e-d8ba-4381-9f6b-a239aa0e50f2.jpg" }, { "id": "fL3KY51ooyUc4mP3mobYix1uTJG2", "name": "craig.cocker@bytes.ae", "avatar": "https://cdn.famousoutfits.com/wp-content/uploads/2015/01/matt-bomer.png" }, { "id": "rWdVaf9lN7dl5rdAlZSh", "name": "nevillerob@me.com", "avatar": "https://image.tmdb.org/t/p/original/hErUwonrQgY5Y7RfxOfv8Fq11MB.jpg" }, { "id": "zVUtlx45vKgwcGDaaALaPT36x5f2", "name": "craig.cocker@gmail.com", "avatar": "https://i.pinimg.com/736x/28/0b/81/280b81785d7ba3ae8f993a94866021cf--william-levi-profile-pics.jpg" }, { "avatar": "https://www.listchallenges.com/f/items/83a48b8e-d8ba-4381-9f6b-a239aa0e50f2.jpg", "id": "NI2eyJAZBFYlEE7F5WOfqXpF9ky1", "name": "craig.cocker@mibusiness.com" }, { "avatar": "https://cdn.famousoutfits.com/wp-content/uploads/2015/01/matt-bomer.png", "id": "fL3KY51ooyUc4mP3mobYix1uTJG2", "name": "craig.cocker@bytes.ae" }, { "avatar": "https://image.tmdb.org/t/p/original/hErUwonrQgY5Y7RfxOfv8Fq11MB.jpg", "id": "rWdVaf9lN7dl5rdAlZSh", "name": "nevillerob@me.com" }, { "avatar": "https://i.pinimg.com/736x/28/0b/81/280b81785d7ba3ae8f993a94866021cf--william-levi-profile-pics.jpg", "id": "zVUtlx45vKgwcGDaaALaPT36x5f2", "name": "craig.cocker@gmail.com" }, { "avatar": "assets/images/avatars/alice.jpg", "id": "56027c1930450d8bf7b10758", "name": "Alice Freeman" }, { "avatar": "assets/images/avatars/danielle.jpg", "id": "26027s1930450d8bf7b10828", "name": "Danielle Obrien" }, { "avatar": "assets/images/avatars/james.jpg", "id": "76027g1930450d8bf7b10958", "name": "James Lewis" }, { "avatar": "assets/images/avatars/vincent.jpg", "id": "36027j1930450d8bf7b10158", "name": "Vincent Munoz" } ]

After Filter / Set Methods

[ { "id": "NI2eyJAZBFYlEE7F5WOfqXpF9ky1", "name": "craig.cocker@mibusiness.com", "avatar": "https://www.listchallenges.com/f/items/83a48b8e-d8ba-4381-9f6b-a239aa0e50f2.jpg" }, { "id": "fL3KY51ooyUc4mP3mobYix1uTJG2", "name": "craig.cocker@bytes.ae", "avatar": "https://cdn.famousoutfits.com/wp-content/uploads/2015/01/matt-bomer.png" }, { "id": "rWdVaf9lN7dl5rdAlZSh", "name": "nevillerob@me.com", "avatar": "https://image.tmdb.org/t/p/original/hErUwonrQgY5Y7RfxOfv8Fq11MB.jpg" }, { "id": "zVUtlx45vKgwcGDaaALaPT36x5f2", "name": "craig.cocker@gmail.com", "avatar": "https://i.pinimg.com/736x/28/0b/81/280b81785d7ba3ae8f993a94866021cf--william-levi-profile-pics.jpg" }, { "id": "NI2eyJAZBFYlEE7F5WOfqXpF9ky1", "name": "craig.cocker@mibusiness.com", "avatar": "https://www.listchallenges.com/f/items/83a48b8e-d8ba-4381-9f6b-a239aa0e50f2.jpg" }, { "id": "fL3KY51ooyUc4mP3mobYix1uTJG2", "name": "craig.cocker@bytes.ae", "avatar": "https://cdn.famousoutfits.com/wp-content/uploads/2015/01/matt-bomer.png" }, { "id": "rWdVaf9lN7dl5rdAlZSh", "name": "nevillerob@me.com", "avatar": "https://image.tmdb.org/t/p/original/hErUwonrQgY5Y7RfxOfv8Fq11MB.jpg" }, { "id": "zVUtlx45vKgwcGDaaALaPT36x5f2", "name": "craig.cocker@gmail.com", "avatar": "https://i.pinimg.com/736x/28/0b/81/280b81785d7ba3ae8f993a94866021cf--william-levi-profile-pics.jpg" }, { "avatar": "https://www.listchallenges.com/f/items/83a48b8e-d8ba-4381-9f6b-a239aa0e50f2.jpg", "id": "NI2eyJAZBFYlEE7F5WOfqXpF9ky1", "name": "craig.cocker@mibusiness.com" }, { "avatar": "https://cdn.famousoutfits.com/wp-content/uploads/2015/01/matt-bomer.png", "id": "fL3KY51ooyUc4mP3mobYix1uTJG2", "name": "craig.cocker@bytes.ae" }, { "avatar": "https://image.tmdb.org/t/p/original/hErUwonrQgY5Y7RfxOfv8Fq11MB.jpg", "id": "rWdVaf9lN7dl5rdAlZSh", "name": "nevillerob@me.com" }, { "avatar": "https://i.pinimg.com/736x/28/0b/81/280b81785d7ba3ae8f993a94866021cf--william-levi-profile-pics.jpg", "id": "zVUtlx45vKgwcGDaaALaPT36x5f2", "name": "craig.cocker@gmail.com" }, { "avatar": "assets/images/avatars/alice.jpg", "id": "56027c1930450d8bf7b10758", "name": "Alice Freeman" }, { "avatar": "assets/images/avatars/danielle.jpg", "id": "26027s1930450d8bf7b10828", "name": "Danielle Obrien" }, { "avatar": "assets/images/avatars/james.jpg", "id": "76027g1930450d8bf7b10958", "name": "James Lewis" }, { "avatar": "assets/images/avatars/vincent.jpg", "id": "36027j1930450d8bf7b10158", "name": "Vincent Munoz" } ]
ccocker
  • 1,146
  • 5
  • 15
  • 39
  • The problem is you're comparing the objects in the array with each other. Even if the contents of said objects are the same, the objects will never equal one another, as they are references to different values. The `Set` approach can not work with an array of objects. As the dupe explains, you can use a `filter`. – Cerbrus May 22 '18 at 10:14
  • Ah ok - So i should take the two arrays that i am concatenating and perform the set on those rather than concatenating the two arrays. I will try that and see how i go and update when i am finished. Thanks for quick response – ccocker May 22 '18 at 10:17
  • No, `Set` will not work. You need to use a `filter`. Look at the dupe target. The __highest voted__ answer there is what you need. (Not the accepted answer) – Cerbrus May 22 '18 at 10:18

0 Answers0