Angular удалить / отфильтровать повторяющуюся национальность из массива - PullRequest
Новая
       82

Angular удалить / отфильтровать повторяющуюся национальность из массива

1 голос
/ 04 августа 2020

У меня есть два раскрывающихся списка: один для страны, а другой - для гражданства. Оба раскрывающихся списка имеют общий массив: countryAndNationalityList.

Я пытаюсь отобразить соответствующую национальность только один раз, поскольку она одинакова для каждой страны. 

<select class="form-control" formControlName="residence_country">
    <option *ngFor="let item of removeNationalityDuplicates(countryAndNationalityList.sort(sortCountryAsc))" [ngValue]="item.country">{{item.country}}</option>
</select>

<select class="form-control" formControlName="nationality">
    <option value="" disabled>Your Nationality?</option>
    <option *ngFor="let item of countryAndNationalityList.sort(sortNationalityAsc)" [ngValue]="item.nationality">{{item.nationality}}</option>
</select>

Мой массив countryAndNationalityList выглядит следующим образом : 

[{country: "United Arab Emirates Abu Dhabi", nationality: "Emirati"},
{country: "United Arab Emirates Ajman", nationality: "Emirati"},
{country: "United Arab Emirates Al-Quwain", nationality: "Emirati"},
{country: "United Arab Emirates Dubai", nationality: "Emirati"},
{country: "United Arab Emirates Fujairah", nationality: "Emirati"},
{country: "United Arab Emirates Ras Al Khaimah", nationality: "Emirati"},
{country: "United Arab Emirates Sharjah", nationality: "Emirati"}]

Я пытаюсь удалить дубликаты Emirati в раскрывающемся списке Национальность с помощью функции: removeNationalityDuplicates, которая удаляет дубликаты следующим образом: 

<select class="form-control" formControlName="nationality">
    <option value="" disabled>Your Nationality?</option>
    <option *ngFor="let item of removeNationalityDuplicates(countryAndNationalityList.sort(sortNationalityAsc))" [ngValue]="item.nationality">{{item.nationality}}</option>
</select>

где removeNationalityDuplicates - 

  removeNationalityDuplicates(array) {
    return [... new Set(array)];
  }

  sortNationalityAsc(previous, next) {
    return previous.nationality > next.nationality;
  }

Я также пробовал использовать: 

removeNationalityDuplicates(array) {
  return array.reduce((uniqueArr, curVal)=> {
    if (!uniqueArr.includes(curVal.nationality)) {
      uniqueArr.push(curVal);
    }
    return uniqueArr;
  }, []);
}

Как удалить повторяющиеся национальности?

Ответы [ 2 ]

2 голосов
/ 04 августа 2020 
removeNationalityDuplicates(array) {
  return Array.from(new Set(array.map(x => x.nationality)));
}

Пояснение:

  1. array.map(x => x.nationality) создать новый массив только с ключом nationality
  2. new Set(array.map(x => x.nationality)) создать набор этого массива (работает как отдельный )
  3. Array.from(new Set(array.map(x => x.nationality))); преобразовать набор в массив.
1 голос
/ 04 августа 2020

Если вы ищете возможность отфильтровать исходный массив, но без изменения его свойств, используйте это решение: 

const removeNationalityDuplicates = (arr) => [...new Map(arr.map(item => [item.nationality, item])).values()]


const list = [{
    country: "United Arab Emirates Abu Dhabi",
    nationality: "Emirati"
  },
  {
    country: "United Arab Emirates Ajman",
    nationality: "Emirati"
  },
  {
    country: "United Arab Emirates Al-Quwain",
    nationality: "Emirati"
  },
  {
    country: "United Arab Emirates Dubai",
    nationality: "Emirati"
  },
  {
    country: "United Arab Emirates Fujairah",
    nationality: "Emirati"
  },
  {
    country: "United Arab Emirates Ras Al Khaimah",
    nationality: "Emirati"
  },
  {
    country: "United Arab Emirates Sharjah",
    nationality: "Emirati"
  }
]

console.log(removeNationalityDuplicates(list))

Если вы хотите, чтобы sh имел только список национальностей, посмотрите на решение enno.void .

...