I have a select list of axleTypes, each having a Type property of either a Front Axle or a Rear Axle. I can not seem to filter out duplicate words of 'Front' and 'Rear'.
Update:
Html:
<select ng-model="axleType.Type" ng-options="type for type in uniqueTypes">
Controller:
$scope.axleTypes = API.GetAxleTypes();
$scope.fixedAxleTypes = [
{ "$id": "1", "Description": "I beam, telescopic type shock absorbers", "Type": "Front", "Id": 1 },
{ "$id": "2", "Description": "Full-floating banjo housing", "Type": "Rear", "Id": 2 },
{ "$id": "3", "Description": "Something Else", "Type": "Rear", "Id": 2 },
{ "$id": "4", "Description": "I beam, telescopic type shock absorbers", "Type": "Front", "Id": 4 }
];
// This Works
$scope.uniqueTypes = _.uniq(_.pluck($scope.fixedAxleTypes, 'Type'));
// This does not
//$scope.uniqueTypes = _.uniq(_.pluck($scope.axleTypes, 'Type'));
// This does not
//$scope.uniqueTypes = _.uniq(_.pluck(API.GetAxleTypes(), 'Type'));
I am thoroughly confused. And yes, the API works, I copy pasted above data from Chrome > Network>Response window
Seeing the error that you added in your edit, I'm sure that the reason is what I described in my comment, which is the use of the (axleType.Type) expression for the filter in a context where that expression cannot be evaluated. Since you're not using the expression in the filter implementation, you could just omit it altogether, I believe.
What i guess is API.GetAxleTypes(); should be doing some asynch tasks like calling $http.
if that is the case then $scope.axleTypes wont be of the array type you are looking for.
The the GetAxleTypes can look something similar to this.
Service definition:
{
uniqueaxleTypes:[],
GetAxleTypes = function($http,..){
var promise = $http({
//config
})
promise.then(function(response){
this.uniqueaxleTypes = _.uniq(_.pluck(response.data, 'Type'));
})
}
}
Then if you bind a scope variable to this uniqueaxleTypes it will always reflect the unique values.
Since $scope.fixedAxleTypes is a hard coded value, its working fine.