Angularjs ng-show == Id?

Question

I was sitting on an issue trying to figure it out and then unexpectedly did something that worked! :)

But I have no idea why it is working??

Would appreciate it if someone could explain it to me.

What I wanted to do was: using Id values to determine whether the button should display or not, like :

If Id == 1 button should be shown.

and if Id >= 2 button should be hidden.

and I have another event where I toggle the Id's manually and the button Shows/Hides correctly as I change the values.

HTML

The thing that boggles me is ng-show="S == ph[0].PhaseId" because, in my explanation I said it should be determined with the Id's. and with this coding it does not (in my sense) show where it compares the value to the correct Id's.

 <button ng-if="ph" type="button" class="col button button-small button-dark" ng-init="showMe(ph);" ng-show="S == ph[0].PhaseId">
Check In
</button>

Javascript

 $scope.showMe = function()
  {  
        $scope.S = true;
  }

Answer 1

As a rule of thumb just test the exact code you put inside an ng-show (or ng-if or ng-hide ) and verify that in a certain condition is evaluates to true . In this case with $scope.S = true the expression S == ph[0].PhaseId evaluate to true . Why? Because == works a little different than in other languages, probably here you need === .

For example true == 1; evaluates to true but true === 1; evaluates to false . Here a better reference.

Try to change == with ===

Answer 2

I didn't get your question exactly but looking at the query, it seems that since you are calling showMe() initially, the value for your bool S will become true . Now for 1==true it will return true while for any other value that will return false. So it shows up when id is 1 and gets hidden for any other value.

Answer 3

The thing is that you are using a non-strict comparison ('==') and types of the values are not being compared. true value is a 1 (basically), so true == 1 will return true, while true == 2 will return false. That's a pretty brief explanation, but that's how I see this :-)

Answer 4

Simply use the following in ng-show. when the value is 1 it shows otherwise it hides.

ng-show="ph[0].PhaseId"