CODEWITHSUNDEEP
javascriptangularjsangular-filters
Antonis
Antonis

Reputation: 195

Dynamic value in FilterBy inside two Ng-repeat Angularjs

I would like to filter the second ng-repeat by dynamic value which comes from the first ng-repeat. My code is:

<div ng-repeat="all in all | unique: 'Category'">
   <p>{{all.Category}}<p>
      <div class="list" ng-repeat="tabs in tabs | filterBy: ['Category']:  '{{all.Category}}'">

I tried the code above but the filterBy in the second ng-repeat is not working. Do you have any suggestions? Thanks.

Upvotes: 0

Views: 185

Answers (2)

Anil Kumar Ram
Anil Kumar Ram

Reputation: 1221

you have to add div inside div.. for nested ng-repeat.. See DEMO here

HTML

<div ng-app ng-controller="myCtrl">

    <input type="text" ng-model="textSearch" placeholder='name Search'>
    <div ng-repeat="all in userList | filter:textSearch" class="parent">
    {{all.name}}
      <div ng-repeat="child in all.child" class="child">
      {{child.value}}
      </div>
    </div>
</div>

Controller

function myCtrl($scope) {

    $scope.userList=[{
    'name':'Anil',
    'address':'Mumbai',
    'id':1,
    'child':[{
            "id": "0",
            "unit": "10",
            "value": "21000",
            "others":"N"
        },{
            "id": "0",
            "unit": "10",
            "value": "12000",
            "others":"N"
        },{
            "id": "0",
            "unit": "10",
            "value": "22000",
            "others":"N"
        }]
    },{
    'name':'Sunil',
    'address':'Delhi',
    'id':1,
    'child':[{
            "id": "0",
            "unit": "10",
            "value": "21000",
            "others":"N"
        },{
            "id": "0",
            "unit": "10",
            "value": "12000",
            "others":"N"
        },{
            "id": "0",
            "unit": "10",
            "value": "22000",
            "others":"N"
        }]
    },{
    'name':'Manil',
    'address':'Varansasi',
    'id':1,
    'child':[{
            "id": "0",
            "unit": "10",
            "value": "21000",
            "others":"N"
        },{
            "id": "0",
            "unit": "10",
            "value": "12000",
            "others":"N"
        },{
            "id": "0",
            "unit": "10",
            "value": "22000",
            "others":"N"
        }]
    }]
}

Upvotes: 0

N.K
N.K

Reputation: 1690

I don't really understand what is your second filter's param, but if i'am not wrong you should try something like this:

<div ng-repeat="all in all | unique: 'Category'">
  <p>{{all.Category}}<p>
    <div class="list" ng-repeat="tabs in tabs | filter: all.category">

Well, if i'am wrong, please tell me why and i will edit my answer if i can, delete if i don't know how to solve your problem. This should work if all.category is a string (and i suppose it's a string because i don't know what is inside your object)

(EDIT: mistakes were made... yes, you need to do your second ng-repeat inside the first one.)

Upvotes: 2

Related Questions