Is it possible to return empty string when some value is "0", but from HTML page using angularJs?

If I have something like this:

<p>External | Year of Birth: {{profileCtrl.person.year}}</p>

Can I write some expression right there that will check the value for profileCtrl.person.year? If the value is "0" then return empty string, else return value of profileCtrl.person.year.

Something like this is very easy to do in languages like C#, but since I am very new to Angular I was unable to find out if this technology has a power to do such thing?

Can someone help me out with this maybe?

Is it possible to return empty string when some value is "0", but from HTML page using angularJs?

If I have something like this:

<p>External | Year of Birth: {{profileCtrl.person.year}}</p>

Can I write some expression right there that will check the value for profileCtrl.person.year? If the value is "0" then return empty string, else return value of profileCtrl.person.year.

Something like this is very easy to do in languages like C#, but since I am very new to Angular I was unable to find out if this technology has a power to do such thing?

Can someone help me out with this maybe?

• javascript
• angularjs

• 1 did you try {{profileCtrl.person.year === 0?"":profileCtrl.person.year}} – Developer Commented Dec 23, 2016 at 8:53

6 Answers 6

You can do it like this:

{{profileCtrl.person.year === 0 ? "" : profileCtrl.person.year}}

You can use a ternary operator to achieve this;

{{profileCtrl.person.year === 0 ? "" : profileCtrl.person.year}}

This basically says, if it's 0 provide "", else provide the year.

Hope it helps!

You could use the ternary operator ?:

{{ profileCtrl.person.year === 0 ? "" : profileCtrl.person.year }}

You could use a logical OR ||, which uses the second value if the first value is falsy.

<p>External | Year of Birth: {{profileCtrl.person.year || ""}}</p>

Another solution could be to show the wole part, with ng-show attribute and a truthy value. On a falsy value the part is hidden.

<p ng-show="profileCtrl.person.year">External | Year of Birth: {{profileCtrl.person.year}}</p>

Use ternary operator:

<p>External | Year of Birth: {{profileCtrl.person.year !== 0 ? profileCtrl.person.year : ""}}</p>

Another approach might be (haven't checked):

<p>External | Year of Birth: {{profileCtrl.person.year || ""}}</p>

you can use filter in your code for return empty

//js file
app.filter("filterName",function(){
    return function(input){
           switch(input){
           case 0:
           return "";
    }
});

<!-- html page -->
{{input | filterName}}