Geek Answers Handbook

Angular - Filter to remove empty strings from an array

I have an array object ... An array can contain spaces, how can I create an ANgular filter to remove spaces to determine the length of the array?

$scope.myData = { ["1", "1", "4", "4", "N", "4", "6", "8", "", "", "", "", "", "", "", "", "", "", ], ["2", "2", "4", "6", "0", "6", "5", "4", "2", "", "8", "", "", "", "", "", "", "", ], ["2", "3", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ], ["3", "F", "D", "3", "5", "1", "D", "5", "", "", "", "", "", "", "", "", "", "", ], ["1", "V", "4", "4", "3", "2", "1", "1", "4", "", "", "", "", "", "", "", "", "", ], ["4", "5", "8", "6", "4", "2", "8", "7", "1", "1", "2", "", "", "", "", "", "", "", ], ["4", "4", "R", "F", "D", "8", "4", "2", "4", "8", "7", "4", "8", "", "", "", "", "", ], ["D", "5", "F", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ], ["1", "4", "1", "3", "4", "B", "D", "G", "", "", "", "", "", "", "", "", "", "", ] }

HTML:

 <div ng-repeat="data in myData"> <div ng-show="(data | myFilter).length > 10"> Show if length greater than 10 </div> <div ng-show="(data | myFilter).length > 15"> Show if length greater than 15 </div> </div>

thanks

+1
source share
4 answers

 var app = angular.module('app', []); app.filter('myFilter', function() { return function(input) { var newInput = []; angular.forEach(input, function(item) { console.log(item); if (item != "") newInput.push(item); }); return newInput; }; }); app.controller('fCtrl', function($scope) { $scope.myData = [ ["1", "1", "4", "4", "N", "4", "6", "8", "", "", "", "", "", "", "", "", "", ""], ["2", "2", "4", "6", "0", "6", "5", "4", "2", "", "8", "", "", "", "", "", "", ""], ["2", "3", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""], ["3", "F", "D", "3", "5", "1", "D", "5", "", "", "", "", "", "", "", "", "", ""], ["1", "V", "4", "4", "3", "2", "1", "1", "4", "", "", "", "", "", "", "", "", ""], ["4", "5", "8", "6", "4", "2", "8", "7", "1", "1", "2", "", "", "", "", "", "", ""], ["4", "4", "R", "F", "D", "8", "4", "2", "4", "8", "7", "4", "8", "", "", "", "", ""], ["D", "5", "F", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""], ["1", "4", "1", "3", "4", "B", "D", "G", "", "", "", "", "", "", "", "", "", ""] ]; }); 
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app"> <div ng-controller="fCtrl"> <div ng-repeat="data in myData "> <span>{{data | myFilter }}</span> <div ng-show="(data | myFilter).length > 10"> Show if length greater than 10 </div> <div ng-show="(data | myFilter).length > 15"> Show if length greater than 15 </div> <hr/> </div> </div> </div>
+2
source

Use this link https://github.com/a8m/angular-filter

It gives you several ways to filter everything you need in any format. It also has examples along with each filter.

+2
source

First, I want to note that your JS object is invalid.

In this case, use an array of arrays instead of an array object.

 $scope.myData = [ ["1", "2", "3", "4", "5", "6", "7", "8", "9", "", "", "", "", "", "", "", "", "" ], ["1", "2", "3", "4", "5", "6", "7", "8", "", "", "", "", "", "", "", "", "", "" ], ["1", "2", "3", "4", "5", "6", "7", "", "", "", "", "", "", "", "", "", "", "" ], ["1", "2", "3", "4", "5", "6", "", "", "", "", "", "", "", "", "", "", "", "" ] ];

And secondly, I created a filter to remove empty elements.

 .filter('removeBlankItems', function() { return function(inputArray) { var outArray = []; for (var i = 0; i < inputArray.length; i++) { if(inputArray[i].length != 0){ outArray.push(inputArray[i]); } } return outArray; }; })

This is a JSFiddle with a working example.

+2
source

Other answers did not work for me, and angular-filter does not have any specific abilities for this case, but the following worked in my Angular application. No custom filter required.

 arr = ["", "foo", "bar"]; arr.filter(Boolean);

Browser Compatibility: http://kangax.imtqy.com/compat-table/es5/#Array.prototype.filter

+1
source

More articles:


All Articles