3

I would like to filter an employee object array using $filter('filter') to filter the results based on an employee's first name field ONLY that can be selected from the drop down/select. Notes that I do NOT want to use the "| filter:" in the ng-repeat".

The difficulty is that the name field is a property of another field called 'details', so I can't details.name like the code below because it will error.

$scope.filteredEmployees = $filter('filter')(employees, {details.name: selectedName });

See below for structure of the employee array object.

How can I tell it to filter the records based on details.name field using $filter('filter')?

Thank you in advance for your help!

Here is the code:

Var selectedName = “An”;
$scope.filteredEmployees = $filter('filter')(employees, {**details.name:** selectedName });
Var employees  = [
      {
        Date: 01/01/2012
        details: {
          name: ‘An’,
      age: 25

        }
      },
      {
        Date: 01/01/2012
        details: {
          name: ‘'Bill',
      age: 20

        }
            }];

    //Here is 
    <select ng-model="selectedName" ng-options="e for e in employees" data-ng-show="employees.length > 0" ng-change="filterEmployees">
        <option value="">All Employees</option>
    </select><br>

    function filterEmployees()  {
        $scope.filteredEmployees = $filter('filter')(employees, "Joe");
    };
Improve this question

1 Answer 1

Reset to default
10

The expression can be a map of property-to-filters: where each property in the object maps to a corresponding property within the result set.

$filter('filter')(employees, {name:"Joe"});

Live Demo

Using A Custom Function

If your data is more complex, and you need more advanced filtering, then you can simply pass in a custom predicate function to evaluate whether or not an item should be filtered.

The input of the function takes each item of the array as an argument, and is expected to return false if the item should be excluded from the result set.

var people = [{date:new Date(), details:{
    name: 'Josh',
    age: 32
}}, {date:new Date(), details:{
    name: 'Jonny',
    age: 34
}}, {date:new Date(), details:{
    name: 'Blake',
    age: 28
}}, {date:new Date(), details:{
    name: 'David',
    age: 35
}}];

$scope.filteredPeople = $filter('filter')(people, function(person){
    return /^Jo.*/g.test(person.details.name);
});

Live Demo

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Thank you Josh. I just realize that my employees array objects has nesting structure. here is employee array array object: var employees = [{ details: {name: 'Josh', age: 32 }, { name: 'Jonny', age: 34 }, { name: 'Blake', age: 28 }, { name: 'David', age: 35 }];
Your sample isn't quite valid. Which is it: {details: {name:'foo',age:32}},{details: {name:'bar',age:32}} or {details: [{name:'foo',age:32},{name:'bar',age:32}]}
Josh, sorry below is my data. I tried to do {details.name: selectedName}, but it didn’t work. How can I filter by pass in the “details.name” with the variable selectedName=”Jo”? Var selectedName = “Jo”; $scope.filteredEmployees = $filter('filter')(employees, {details.name: selectedName }); Var employees = [ { Date: 01/01/2012 details: { name: ‘Josh’, age: 32 } }, { Date: 01/01/2012 details: { name: ‘'Jonny', age: 34 } }];
@user3439326 - I've updated the answer to show how you can use a predicate function to filter as well.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.