Angular ng-if clause not working both ways

Question

I am displaying a json in a table, like so:

<tr ng-repeat="room in allRooms | orderBy: 'OpenTime'">

Where allRooms contains json objects like this:

{
  "Name": "Room five",
  "OpenTime": "2016-02-19 00:00:00",
  "Entries": 2,
  "Capacity": 10,
  "Type": "TypeThree"
}

And the the Type property can be one of Five different values ("typeOne", "typeTwo", "TypeThree" etc.)

I want to use an ng-if to display a button in a column, only if Type is not "typeOne" or "typeTwo", e.g.:

<button type="button" ng-if="room.Type != 'typeOne' || room.Type != 'typeTwo'"></button>

This isn't working for me, although it is what I need.

But, this (although it doesn't achieve what I need) does work:

<button type="button" ng-if="room.Type == 'typeOne' || room.Type == 'typeTwo'"></button>

So I'm wondering why the second ng-if works as it should, but the first one doesn't, when the only difference between the two is the use of the equal to or not equal to operators?

Answer 1

The problem here is in your logic. Without knowing what's in your data for allRooms, I can best illustrate why the first if statement is weird by using numbers. Let's assume the if statement was the following:

if (a !== 1 || a !== 2)

That if statement will always be true. Can't be otherwise, because if the value is 1, it's not 2, and if it's 2, it's not 1. So the problem with the first if statement is that it will always evaluate to true, never false.

What you might have wanted instead is the equivalent of this:

if (a !== 1 && a !== 2)

In which case the if statement would pass for integers lower than 1 and greater than 2, and fail for 1 or 2. In fact, it would pass for any value, integer or not!