If value is 0 then return empty string in Angularjs

Question

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?

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

Akash Nigam · Accepted Answer · 2016-12-23 08:54:12Z

2

You can do it like this:

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

answered Dec 23, 2016 at 8:54

Akash Nigam

4175 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Tom Johnson · Accepted Answer · 2016-12-23 08:52:54Z

2

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!

answered Dec 23, 2016 at 8:52

Tom Johnson

7015 silver badges16 bronze badges

Comments

Christos · Accepted Answer · 2016-12-23 08:53:29Z

2

You could use the ternary operator ?:

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

answered Dec 23, 2016 at 8:53

Christos

54.1k9 gold badges82 silver badges114 bronze badges

Comments

Nina Scholz · Accepted Answer · 2017-04-03 13:03:53Z

2

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>

edited Apr 3, 2017 at 13:03

answered Dec 23, 2016 at 8:53

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

2 Comments

Rajesh Dixit Over a year ago

This will give blank string for all falsey values. undefined, null, 0, '', false

Nina Scholz Over a year ago

@Rajesh, yes, it does. and it is better than the real falsey value for a web output. but op expects only zero value, this is converted to an empty string.

Lazyexpert · Accepted Answer · 2016-12-23 08:54:06Z

0

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>

answered Dec 23, 2016 at 8:54

Lazyexpert

3,1741 gold badge22 silver badges33 bronze badges

Comments

pejman · Accepted Answer · 2016-12-25 14:07:51Z

0

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}}

answered Dec 25, 2016 at 14:07

pejman

8088 silver badges15 bronze badges

Collectives™ on Stack Overflow

If value is 0 then return empty string in Angularjs

6 Answers 6

Comments

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related