Search code examples
htmlcssangularjsmeanjs

How to Filter Two ng-module Values in a Table using Angularjs Filter?


I am using MEAN stack in my application with AngularJS as my front-end. How can I filter two ng-module values in a table.My Plunker without filter and My Plunker with filter.

  • I want to filter two ng-module value in a table.
  • I can able to filter single ng-module values like using of this | filter:{raised: 'true'} in ng-repeat.
  • I can't able to filter the two ng- module values, if I have use this | filter:{raised: 'true'} in ng-repeat.
  • what I am Excatly looking for :- if raised value is true means these true values only need to display in a table so that I have used | filter:{raised: 'true'} filter in ng-repeat.
  • If raised_two value is also true means I should need to display these true values in a table so that I have used | filter:{raised_two: 'true'} filter in ng-repeat..
  • But if we used two ng-module filters in ng-repeat the table is displaying like empty .... so how can I filter two ng-module valuse in a table....
  • I want to display true values of raised module and raised_two module in table.

My Filters:-

<tr ng-repeat="data in  srdebitnote | filter:{raised: 'true'} ">

 <tr ng-repeat="data in  srdebitnote | filter:{raised_two: 'true'} ">

My html:-

 **<tr ng-repeat="data in  srdebitnote | filter:{raised: 'true'} ">
           <td> {{data.buyer_name}}</td>
            <td> {{data.supplier_name}}</td>
            <td> {{data.proforma_invoice_no}}</td>
            <td> {{data.purchase_order_no}}</td>
            <td> {{data.raised}}</td>
            <td> {{data.raised_two}}</td>
        </tr>**

My controller:-

 $scope.srdebitnote = [{
    "_id": "57db960f6a3b14d20dfb39d6",
    "user": {
    "_id": "57400c32bd07906c1308e2cf",
    "displayName": "mani selvam"
    },
    "__v": 0,
    "created": "2016-09-16T06:49:51.970Z",
    "shipment_id": "57c815a89a9b487f14b40bab",
    "raised_two": true,
    "raised": false,
    "invoice_number": "E21_56",
    "proforma_invoice_no": "6 years",
    "purchase_order_no": "8888",
    "supplier_name": "veena",
    "buyer_name": "risha"
    },

    {
    "_id": "57daa24fafebd11818b55d94",
    "user": {
    "_id": "57400c32bd07906c1308e2cf",
    "displayName": "mani selvam"
    },
    "__v": 0,
    "created": "2016-09-15T13:29:51.398Z",
    "shipment_id": "57c815a89a9b487f14b40bab",
    "raised_two": true,
    "raised": false,
    "invoice_date": "2016-09-13",
    "invoice_number": "E21_56",
    "proforma_invoice_no": "6 years",
    "purchase_order_no": "8888",
    "supplier_name": "rubi",
    "buyer_name": "kanishka"
    },

    {
    "_id": "57becb6ddc4a44520ac628f4",
    "user": {
    "_id": "57400c32bd07906c1308e2cf",
    "displayName": "mani selvam"
    },
    "__v": 0,
    "created": "2016-08-25T10:41:49.133Z",
    "shipment_id": "57becb69dc4a44520ac628f3",
    "raised_two": false,
    "raised": true,
    "invoice_number": "E21_check",
    "proforma_invoice_no": "kdkdkd",
    "purchase_order_no": "1356",
    "supplier_name": "karikalan",
    "buyer_name": "ms"
    },

    {
    "_id": "57bdaa65ecc4b1701401fce4",
    "user": {
    "_id": "57400c32bd07906c1308e2cf",
    "displayName": "mani selvam"
    },
    "__v": 0,
    "created": "2016-09-15T13:29:51.398Z",
    "shipment_id": "57c815a89a9b487f14b40bab",
    "raised_two": false,
    "raised": true,
    "invoice_date": "2016-09-13",
    "invoice_number": "E21_56",
    "proforma_invoice_no": "6 years",
    "purchase_order_no": "8888",
    "supplier_name": "rubi",
    "buyer_name": "kanishka"
    }];

If i Used filter like this datas showing like empty in table:-

<tr ng-repeat="data in  srdebitnote | filter:{raised: 'true'} | filter:{raised_two: 'true'} ">

Solution

  • You can write your own filter for this like so:

    <tr ng-repeat="data in  srdebitnote | filter: raised">
    
    //Controller
     $scope.raised = function(item){
        if (raised.raised && raised.raised_two){
            return true;
        }
        return false;
     };
    

    If you want to do an OR instead of an AND, then you can filter for either condition to be true.

    Working Plunkr here