Remove elements from array based on filter in angularjs

Question

How can I remove elements from array based on a filter, remove only those indexes when 'quantity' is 0 and 'isSelected' is false? Any suggestion. Here is my code:

<table data-ng-repeat="st in Absorb track by $index" data-ng-cloak data-ng-init="remove(st)"> 
 <tr>
 <td> 
 <input type="radio" name="groupName" data-ng-model ="st.isSelected" data-ng-checked="(st.isSelected == true)"/>
 </td>
 <td> 
 <span>{{st.ProjectedQuantityOnHand}}</span>
 </td>
 <td style="display:none" data-ng-if="st.ProjectedQuantityOnHand == 0"> 
 <input type="number" data-ng-model="st.ProjectedQuantityOnHand" style="display:none">
 </td>
 </tr>
</table>

JS code:

$scope.Absorb = [
 {"Name":"apple", ProjectedQuantityOnHand:"0", isSelected:true},
 {"Name":"mango", ProjectedQuantityOnHand:"0", isSelected:false}
 {"Name":"ball", ProjectedQuantityOnHand:"1", isSelected:false}
 {"Name":"football", ProjectedQuantityOnHand:"1", isSelected:false}
]
$scope.remove = function (item) {
 var availableqauantity = 0
 debugger
 angular.forEach($scope.StockList, function (i) {
 var FilteredProduct1 = $filter('filter')($scope.StockList, { isSelected: false, ProjectedQuantityOnHand: 0 });
 if (FilteredProduct1.length > 0) {
 availableqauantity = FilteredProduct1[0].ProjectedQuantityOnHand;
 if (availableqauantity == 0)
 $scope.StockList.splice(i,1);
 }
 });
}

• Eddi: Do you actually want to remove these items from the array or do you want them just not to display?
• Reshav: @Eddi ya just don't want to display them
• user9903: for angulars 1.x or 2? in angular 2 you would do filtering within your component's class rather than in the template with the filter pipe.

Answer 1

<table data-ng-repeat="st in Absorb | filter:{isSelected: '!false', ProjectedQuantityOnHand: '!0'} track by $index" data-ng-cloak> 

This will show only those items, which have isSelected different than false and ProjectedQuantityOnHand different than 0. No need for external function.

UPDATE

https://plnkr.co/edit/gPz5pKSIOxZ6odSU3TfF?p=preview

Check this example. Here I've made a custom filter to hide items only when ProjectedQuantityOnHand is 0 and isSelected is false.

app.filter('customFilter', function() {
 return function(values) {
 var filtderResult = [];
 angular.forEach(values, function(value) {
 if (value.isSelected || value.ProjectedQuantityOnHand !== 0) {
 filtderResult.push(value);
 }
 });
 return filtderResult;
 }
});

• Reshav: i guess this will not work in my case. i have to hide only those elements where projectedquantity is 0 and have to show all whether it is selected or not doesnt matter. take an example, suppose projectedquantity is 0 but if it is selected then i have to show that element . it will work filter:{isSelected: '!false'} but it will only show the selected record right ?
• kodu.cloud: You can can remove isSelected: '!false' to hide only {ProjectedQuantityOnHand: 0} elements. Or there is some other function for isSelected property?
• Reshav: yeah having other functions also. i post only those codes which is based on concept @hardy
• kodu.cloud: So you need to display item when it is selected despite of ProjectedQuantityOnHand value? Is that correct?
• Reshav: take a look at my object , i have to hide only mango from this array, and have to show all those elements.