I am trying to make a filter using an array of object. but I am not getting the answer as per I requested.
the object the one I looping though has 3 steps of arrays. I am trying to filter them and show in the li
element but not working. only the first step works for me.
the array is : "Name,
SubProjectsand
Contracts` ( all are nested inside of the main object)
here is my try:
<div class="section filter1">
<ul>
<li ng-repeat="value in values"> {{value.Name}}</li>
</ul>
</div>
<div class="section filter2">
<ul>
<li ng-repeat="value in values | SubProjects"> {{$index}}</li>
</ul>
</div>
<div class="section filter3">
<ul>
<li ng-repeat="value in values | SubProjects | Contracts"> {{value.Name}}</li>
</ul>
</div>
object for sample :
{
"Id": "1",
"Name": "Khalifa International Stadium",
"SubProjects": [
{
"Contracts": [
{
"CompletedPercentage": 0,
"Id": "583",
"Name": "LP/C21/145",
"Phase": null
},
{
"CompletedPercentage": 0,
"Id": "529",
"Name": "KP/B21/134",
"Phase": null
},
{
"CompletedPercentage": 0,
"Id": "575",
"Name": "LP/C21/142",
"Phase": null
}
],
"Id": "2",
"Name": "Energy Center"
},
You need to build the custom filter according to your requirement here. See this example, and let me know if you face any issue with your case. For documentation please check. A more simple example with same approach.
<input type="text" ng-model="search">
<ul ng-repeat="oneauth in authorisations[0]">
<li ng-repeat="entry in oneauth | nameFilter:search">
{{entry.auth.name}}</li>
</ul>
app.filter('nameFilter', function(){
return function(objects, criteria){
var filterResult = new Array();
if(!criteria)
return objects;
for(index in objects) {
if(objects[index].auth.name.indexOf(criteria) != -1) // filter by name only
filterResult.push(objects[index]);
}
console.log(filterResult);
return filterResult;
}
});