Cheekumz
Cheekumz

Reputation: 73

Dealing with null values in angular (9) ngFor

I have a table being populated by an ngFor.

I'm using something like:

{{ (item.attribute || "--" }}

to deal with null values and thats working fine however i have a field that displays a multiple so i add an "x" into it:

{{ (item.attribute + "x") || "--" }}

obviously the "x" is giving it a value hence even if the attribute is null the html is displaying an 'x' instead of my preferred '--'.

im thinking i need to maybe use ngIf but i cant get any implementation working. Anyone able to point me in the right direction?

Thanks in advance.

Upvotes: 1

Views: 1962

Answers (3)

Shlok Nangia
Shlok Nangia

Reputation: 2377

try this

You can use Conditional (ternary) operator, inside of template like below example

{{ item.attribute? (item.attribute + "x"): "--" }}

Upvotes: 2

Tsvetan Ganev
Tsvetan Ganev

Reputation: 8826

You can use a ternary operator in your template:\

{{ item.attribute ? item.attribue + "x" : "--" }}

This will check if item.attribute is truthy and if so, it will return item.attribute concatenated with "x".

Upvotes: 2

Kurt Hamilton
Kurt Hamilton

Reputation: 13515

You can use a Javascript ternary operator here to emit different values based on a logical condition.

{{item.attribute ? item.attribute + "x" : '--'}}

DEMO: https://stackblitz.com/edit/angular-u8ly3l

Upvotes: 2

Related Questions