How do i filter an array inside of a array of objects using filter?

Question

I have an array of products and models that I'm using 'filter'

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {

  $scope.products = [{
      'id': 1,
      'category': 'Tv',
      'models': [{
          'modelno': 12,
          'modelname': 'ASF456'

        },
        {
          'modelno': 13,
          'modelname': 'Aip456'

        }
      ]
    },

    {
      'id': 2,
      'category': 'Mobile',
      'models': [{
          'modelno': 21,
          'modelname': 'FGH74'

        },
        {
          'modelno': 22,
          'modelname': 'UIO06'

        }
      ]

    }

  ];

  $scope.search = '';
  $scope.filterData = function() {
    return $scope.products.filter(function(item) {

      return (item.id.toString().indexOf($scope.search) > -1

        ||
        (item.category.toLowerCase().indexOf($scope.search)) > -1)



    });

  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<body ng-app="myApp" ng-controller="myCtrl">
  <input type="text" ng-model="search">
  <h1 ng-repeat="x in filterData() | filter :search">{{x.id}} {{x.category}}</h1>
</body>

to filter these products by id and category. The filter is working but i want to add one more field inside filter modelname .

How do I set the filter to only apply to the id,category and modelname field of my array rather than every field?

i want to filter by id category ,modelname

now these two fields id ,category filter is done but i want to add modelname also but modelname is inside models array here i am facing problem

nothing wrong i want to filter one more field 'modelname' i dont know how to add this @charlietfl — user10691436
– user10691436, Commented Nov 22, 2018 at 14:18
we can't do like that bcoz again models is array @charlietfl — user10691436
– user10691436, Commented Nov 22, 2018 at 14:30

FarukT · Accepted Answer · 2018-11-22 14:42:33Z

1

You can add another or condition like this

 || (item.models !== null && item.models.length > 0 && item.models.filter(e => {return e.modelname.search($scope.search) > 0 }).length > -1)

edited Nov 22, 2018 at 14:42

answered Nov 22, 2018 at 14:14

FarukT

1,66814 silver badges26 bronze badges

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

5 Comments

user10691436 Over a year ago

can you run my code based on user enter value we need to filter

FarukT Over a year ago

@komal I don't understand what do you want

user10691436 Over a year ago

based on user enter value want to filter by id, category ,modelname now these two fields id ,category filter is done but i want to add modelname also but modelname is inside models array here i am facing problem

FarukT Over a year ago

@komal can you test now?

FarukT Over a year ago

@komal tried now on plunker and it works. I replaced it with -1

BartoszTermena · Accepted Answer · 2018-11-22 14:18:23Z

0

Do i understood correctly - you want to filter your $scope.products by means of id ? if so try like this:

<input ng-model="id " type="number" min="0"/>
<br />
<div ng-repeat="x in products | IDFiletr:id">
  {{x.category}}
  <br />
</div>

JS:

app.filter('IDFiletr',function(){
    return function(data, id) {
        if (!id) return data;
        var ids = [];
        angular.forEach(data, function(item){
            if(item.id === id) {
                ids.push(item);
            }
        });
        return ids;
    };
});

plunker: http://plnkr.co/edit/q9DsvZP4scA1oKsJj3Vu?p=preview

answered Nov 22, 2018 at 14:18

BartoszTermena

1,4871 gold badge11 silver badges16 bronze badges

Collectives™ on Stack Overflow

How do i filter an array inside of a array of objects using filter?

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related