Angular is possible to use ngSwitch on numeric range?

Question

I would like to use ngSwitch based on numeric value range.

I would like to show three different text based on ngSwitch change. However I cannot get this work when I try to set a value range in ng-switch-when. Is this possible or should I use ngIf instead of ngSwitch?

http://jsbin.com/eWIQoJE/1/edit

Answer 1

It's not possible.

The ngSwitch directive checks if the value in ngSwitchWhen is equal to the one in ngSwitch. Instead, you can use ngShow or ngIf as you have proposed:

 <div ng-if="test === 0">Is zero</div>
 <div ng-if="test > 10">Is greater than 10</div>
 <div ng-if="!(test === 0 || test > 10)">Default</div>

JSBin

Answer 2

It is possible, but you need to declare a helper function in your scope

In your controller:

$scope.switchHelper = function(value) {
  if (value === 0)
    return 0;
  if (value > 10)
    return 1;
  if (!(value === 0 || test))
    return 3;
};

An in HTML:

<div ng-switch="switchHelper(test)">
     <div ng-switch-when="0">Is zero</div>
     <div ng-switch-when="1">Is greater than 10</div>
     <div ng-switch-when="3">Default</div>
</div>

As JSBin.