AngularJS通过数组过滤复杂的JSON

Question

I'm having a dropdown list with multiselect option. I want to filter out data from a complex JSON based on that array.

Selected options forms a array of data like:

$scope.myval=["Adyar","Paris","central"];

My JSON :

$scope.myTest={     
    "buslist":
        {
        "code":"1",
        "message":"Success",
        "fromStationCode":"71",
        "searchResult":[        {
        "arrivalTime":"17:00:00",
        "availableSeats":"42",
        "boardingPointDetails":[{
        "code":"1631",
        "name":"Koyambedu",
        "time":"09:30:00"
        },
        {
        "code":"961296",
        "name":"Paris",
        "time":"09:45:00"
        }
        ]
        ]
        },

         {
        "arrivalTime":"18:00:00",
        "availableSeats":"32",
        "boardingPointDetails":[{
        "code":"2084",
        "name":"Adyar",
        "time":"09:30:00"
        },
        {
        "code":"961296",
        "name":"Madurai",
        "time":"09:45:00"
        }
        ]
        ]
        }
        }
        ...
    };

My HTML templating is:

                <tbody ng-repeat=" i in myTest.buslist.searchResult" >
                <tr>
                    <td>{{i.arrivalTime}}</td>
                    <td>{{i.availableSeats}}</td>

                    <td>
                    <p ng-repeat="m in i.boardingPointDetails">{{m.name}}</p>
                    </td>
                </tr>
            </tbody>

I want to filter my data based on selected values. I had tried something like this :

$scope.matched = $scope.myTest.buslist.searchResult.boardingPointDetails.name.indexOf(data);

ie:selected options must match "name" field in "boardingPointDetails" but it fails. Thanks in advance.

Answer 1

Since $scope.myTest.buslist.searchResult.boardingPointDetails is an array $scope.myTest.buslist.searchResult.boardingPointDetails.name is not valid.

You need to use an Array function to get the correct result:

$scope.matched = $scope.myTest.buslist.searchResult.boardingPointDetails.filter(function(el) {
   return el.name === data;
}).length > 0;

---

EDIT:

Due to your comments I understand you want to get the boardPointDetails that has the same name property as one of the data options. Where data is an Array of strings.

This will do the job:

$scope.matched = $scope.myTest.buslist.searchResult.boardingPointDetails.filter(function(el) {
   return data.indexOf(el.name) === 1;
});