简体   繁体   中英

AngularJS deep filter through array in ng-repeat

My question is looking similar to other questions. But it is different. Please take a look of below code.

I want to filter data by an array of objects.

Here is the snippet

HTML

<div
ng-repeat="(key, value) in ledgerData.ledgers track by $index"
ledger-pop 
index="$index"
ftype="ftypeUpdate"
itemdata="value" 
acntlist="fltAccntList"
class='drEntryForm_{{$index}} pr'
name='drEntryForm_{{$index}}'
update-ledger="updateEntry(entry)"
novalidate
>
</div>

JS

$scope.ledgerDataata = {
      "ForwardedBalance": {
      "amount": 0,
      "type": "CREDIT"
      },
      "creditTotal": 4008,
      "debitTotal": 4008,
      "balance": {
      "amount": 4008,
      "type": "CREDIT"
      },
      "ledgers": [
            {
              "transactions": [
                {
                  "particular": {
                    "name": "Sarfaraz",
                    "uniqueName": "temp"
                  },
                  "amount": 1001,
                  "type": "DEBIT"
                }
              ],
              "description": "testing",
              "tag": "testing"
            },
            {
              "transactions": [
                {
                  "particular": {
                    "name": "frnd",
                    "uniqueName": "frndafafaf14453422453110l26ow"
                  },
                  "amount": 2001,
                  "type": "CREDIT"
                },
                {
                  "particular": {
                    "name": "Rahul",
                    "uniqueName": "cake"
                  },
                  "amount": 3001,
                  "type": "DEBIT"
                }
              ],
              "description": "testing",
              "tag": "testing",
            }
      ]
}

I am trying to filter by

ng-repeat="(key, value) in ledgerData.ledgers track by $index | filter:{transactions[0]:{type: 'DEBIT'}}"

But am getting error

thanks in advance :-)

You need to write nested ng-repeat to solve this problem.

  • outer ng-repeat for the array ledgerData.ledgers and
  • inner ng-repeat for transaction array in ledgerData.ledgers

      <div ng-repeat="(keyOne, ledger) in ledgerData.ledgers track by $index"> {{ledger.description}} <div ng-repeat="(keyTwo, transaction) in ledger.transactions | filter:{type:'DEBIT'}"> {{transaction.type}} </div> </div> 

Actually I got the solution.

I've googled hardly and got a library for angularjs-filter .

Here is the link it is very good plugin for filter dirty works and how to use it.

How I got success:

html

ng-repeat="(key, value) in ledgerData.ledgers | pick: debitOnly track by $index"

AngularJS

$scope.debitOnly = (ledger) ->
  'DEBIT' == ledger.transactions[0].type

that's it.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM