Angular remove/filter 来自数组的重复国籍
Angular remove/filter duplicate nationality from array
我有两个下拉选项,一个用于国家,一个用于国籍。
两个下拉列表共享一个数组: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"}]
我正在尝试使用以下函数删除国籍下拉列表中重复的阿联酋: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;
}, []);
}
如何去除重复的国籍?
removeNationalityDuplicates(array) {
return Array.from(new Set(array.map(x => x.nationality)));
}
解释:
array.map(x => x.nationality)
创建一个只有 nationality
键的新数组
new Set(array.map(x => x.nationality))
创建一组这个数组(像不同的一样工作)
Array.from(new Set(array.map(x => x.nationality)));
将集合转换为数组。
如果您正在寻找 过滤 原始数组但不更改其属性的可能性,请使用此解决方案:
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))
如果您只想获得国籍列表,请查看 。
我有两个下拉选项,一个用于国家,一个用于国籍。 两个下拉列表共享一个数组: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"}]
我正在尝试使用以下函数删除国籍下拉列表中重复的阿联酋: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;
}, []);
}
如何去除重复的国籍?
removeNationalityDuplicates(array) {
return Array.from(new Set(array.map(x => x.nationality)));
}
解释:
array.map(x => x.nationality)
创建一个只有nationality
键的新数组new Set(array.map(x => x.nationality))
创建一组这个数组(像不同的一样工作)Array.from(new Set(array.map(x => x.nationality)));
将集合转换为数组。
如果您正在寻找 过滤 原始数组但不更改其属性的可能性,请使用此解决方案:
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))
如果您只想获得国籍列表,请查看