using ng-if to display html content

Question

I want a way to display if something is not present then display something else.

so far I have this:

<span ng-if="likes.length = 0"> No hacks to display </span>

so if the length is zero then display this.

this code filters to order if present:

<md-list-item class="md-3-line hacks-hack"
    ng-repeat="hack in hacksCtrl.hacks | orderBy: likes.length : reverse | filter:searchText | filter:hacksCtrl.filterStatus"
    ng-click=hacksCtrl.goToHack(hack.id)>

not sure what i am missing, thanks

Shyju · Accepted Answer · 2015-12-17 17:13:57Z

2

= operator assign a value to the variable on the left side of the expression.

Use === or == for comparison.

<span ng-if="likes.length === 0"> No hacks to display </span>

=== operator won't do the type conversion before the comparison while == does the type conversion before the comparison.

=== (Identity operator) is the correct way to compare if both the operands are of same type.

Here is minimal a working sample

edited Dec 17, 2015 at 17:13

answered Dec 17, 2015 at 16:59

Shyju

220k106 gold badges421 silver badges499 bronze badges

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

6 Comments

The Hurricane Over a year ago

ok that makes sense, but still wont render it even if the list of hacks disappear

Shyju Over a year ago

@TheHurricane you might have another script error. See my updated answer which has a minimal working sample which solves your original question.

The Hurricane Over a year ago

yours is displaying alongside though, i want it to appear when the list is blank

Shyju Over a year ago

It is displaying that span when the likes is empty.

The Hurricane Over a year ago

ok got ya. mine displays for about a second, then all the hacks appear, then i will search for one that is not there and then the message does not re appear. so how do you get it to display everytime rather than a one off which is what mine is doing for some reason

|

Devin Durtschi · Accepted Answer · 2015-12-17 17:06:11Z

0

Have you tried using ng-show instead of ng-if? ng-if only renders on the page if that statement is true. And where you're using a filter, I would suggest trying ng-show where it is simple text and wouldn't really effect rendering time.

answered Dec 17, 2015 at 17:06

Devin Durtschi

13 bronze badges

3 Comments

The Hurricane Over a year ago

it appears initially, then the array gets populated, then i will search for something not in the array but the message does not pop back up

Devin Durtschi Over a year ago

It appears, after looking at your example again, you're checking likes === 0 and should possibly be checking hacksCtrl.hacks. Or am I misunderstanding your code? Could you create a simple plunkr or something to give me a sample to go off of?

The Hurricane Over a year ago

i am now doing this <div ng-show="hacksCtrl.hacks.length == 0"> No hacks to display </div>

Collectives™ on Stack Overflow

using ng-if to display html content

2 Answers 2

6 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related