Show &nbsp if value empty

angular.module('myApp',[])
    .filter('chkEmpty',function(){
        return function(input){
            if(angular.isString(input) && !(angular.equals(input,null) || angular.equals(input,'')))
                return input;
            else
                return ' ';
        };
    });

Just as @Donal said in order for this to work you'll need to use ngSanitize's directive ng-bind-html like this:

<td class="licnum" ng-bind-html="participant.LicenseNumber | chkEmpty"></td>

EDIT:

Here's a simple example: http://jsfiddle.net/mikeeconroy/TpPpB/


What you have should work. You are missing a closing } and have one in the middle of the expression that needs to be removed.

Here is a demo showing your solution working and an ng-if. http://plnkr.co/edit/UR7cLbi6GeqVYZOauAHZ?p=info

A filter is probably the route to go, but you could do it with a simple ng-if or ng-show (either on the td or even on a span):

<td class="licnum" ng-if="participant.LicenseNumber">{{participant.LicenseNumber}}</td>
<td class="licnum" ng-if="!participant.LicenseNumber">&nbsp;</td>

or

<td class="licnum"><span ng-if="participant.LicenseNumber">{{participant.LicenseNumber}}</span><span ng-if="!participant.LicenseNumber">&nbsp;</span></td>

I'm offering this up as an alternate solution that doesn't require adding code to a controller/filter.

You can read up a little about this method: if else statement in AngularJS templates

Tags:

Angularjs