I revised the response provided by NidhishKrishnan to ensure compatibility with nested objects.
For instance, consider the following data:
$scope.jsonmarkers = [{
"name": "Jeff",
"type": "Organisation + Training Entity",
"userID": "1",
"userData": {
"hire reason":"training"
}
}, {
"name": "Fred",
"type": "Organisation + Training Entity",
"userID": "2"
"userData": {
"hire reason":"training"
}
}];
This is the updated code snippet:
angular.module('ArtifactFeederApp.filters', [])
.filter('unique', function () {
return function (items, filterOn) {
if (filterOn === false) {
return items;
}
if ((filterOn || angular.isUndefined(filterOn)) && angular.isArray(items)) {
var hashCheck = {}, newItems = [];
var extractValueToCompare = function (item) {
if (angular.isObject(item) && angular.isString(filterOn)) {
var resolveSearch = function(object, keyString){
if(typeof object == 'undefined'){
return object;
}
var values = keyString.split(".");
var firstValue = values[0];
keyString = keyString.replace(firstValue + ".", "");
if(values.length > 1){
return resolveSearch(object[firstValue], keyString);
} else {
return object[firstValue];
}
}
return resolveSearch(item, filterOn);
} else {
return item;
}
};
angular.forEach(items, function (item) {
var valueToCheck, isDuplicate = false;
for (var i = 0; i < newItems.length; i++) {
if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) {
isDuplicate = true;
break;
}
}
if (!isDuplicate) {
if(typeof item != 'undefined'){
newItems.push(item);
}
}
});
items = newItems;
}
return items;
};
});
You can now utilize the following:
<div ng-controller="MainController">
<select id="typeselect" ng-options="accnts.type for accnts in jsonmarkers | unique:'userData.hire reason'" ng-model="accnt" ng-change="changeaccnt(accnt.type)" multiple></select>
</div>
With this implementation, you will only see training as a selectable option in the list.