AngularJS - Filter empty objects - angularjs

Question

I have a $scope.myData object that contain a chunk of data. What i am trying to do is display the data but filter out the nulls and empty strings:
$scope.myData = [
{
"ID" : "001",
"Message" : "test test test test"
},
{
"ID" : "002",
"Message" : "test test test test"
},
{
"ID" : "003",
"Message" : "test test test test"
},
{
"ID" : "004",
"Message" : "test test test test"
},
{
"ID" : "005",
"Message" : " "
},
{
"ID" : "006",
"Message" : "test test test test"
},
{
"ID" : "007",
"Message" : "test test test test"
},
{
"ID" : "007",
"Message" : null
}
]
I can perform an ng-repeat on the above and filter null's via:
<div ng-repeat="data in myData | filter:{Message: '!!'}">
{{ data.ID }}
{{ data.Message }}
</div>
But how can i filter the empty strings e.g:
"Message" : " "
Thanks

Answer 1

We can simply use ng-if here:
<div ng-repeat="data in myData " ng-if="data.Message">
{{ data.ID }}
{{ data.Message }}
</div>

Answer 2

You can use a function instead of an object like this
<div ng-repeat="data in myData | filter:emptyOrNull">
{{ data.ID }}
{{ data.Message }}
</div>
And in the controller
$scope.emptyOrNull = function(item){
return !(item.Message === null || item.Message.trim().length === 0)
}

Answer 3

Well you can create a custom filter:
.filter('hasSomeValue', [function(){
return function(input, param) {
var ret = [];
if(!angular.isDefined(param)) param = true;
angular.forEach(input, function(v){
if(angular.isDefined(v.Message) && v.Message) {
v.Message = v.Message.replace(/^\s*/g, '');
ret.push(v);
}
});
return ret;
};
}])
And in your HTML:
<div ng-repeat="data in myData | hasSomeValue: data.Message">
DEMO

Answer 4

You can use '' charter.
Try check like this.
<div ng-repeat="data in myData | filter:{Message: ''}">

Answer 5

You can use an angular filter for this:
Working Fiddle
Code Snippet:
.filter('filterData',function(){
return function(data) {
var dataToBePushed = [];
data.forEach(function(resultData){
if(resultData.Message && resultData.Message != " ")
dataToBePushed.push(resultData);
});
return dataToBePushed;
}
});

Answer 6

If you wanted to filter out values in an object that are empty, you could create a custom filter and filter each based on the value.
Something like this:
.filter("notEmpty",
function () {
return function (object) {
var filteredObj = {};
angular.forEach(object, function (val, key) {
if (val != null) {
if (typeof(val) === "object") {
if (Object.keys(val).length > 0) {
filteredObj[key] = val;
}
} else if (typeof(val) === "string") {
if (val.trim() !== "") {
filteredObj[key] = val;
}
} else {
filteredObj[key] = val;
}
}
});
return filteredObj;
};
});
jsFiddle example
You could also use the ng-if directive and a function that parses the objects as you see fit.