Pappsen
Pappsen

Reputation: 31

Changing AngularJS number input range

I have a very simple question for you. I am currently trying to change the allowed input in my label depending on which ID of the tab I am currently at.

It is a hotel booking app using ionic 1 and angular. Say I am at the hotelroom with an ID of '1', then I want to set the maximum input to 2. But if Im at hotelroom with an ID of '2' I want to set the maximum to 5. Can it be done solely within the label tags?

<label class="item item-input">
  <input type="number" name="adults" required 
placeholder="Antal vuxna" ng-model="data.people">
</label>

Answers shown as examples are highly appreciated :) Thanks in advance!

Upvotes: 2

Views: 146

Answers (1)

georgeawg
georgeawg

Reputation: 48968

Use either, the max attribute with interpolation:

<input type="number" name="adults" max="{{maxPeople}}" required 
       placeholder="Antal vuxna" ng-model="data.people" />

OR the ng-max attribute with an expression:

<input type="number" name="adults" ng-max="maxPeople" required 
       placeholder="Antal vuxna" ng-model="data.people" />

JS

$scope.maxPeople = 2;
if ( hotelroom.ID == 2 ) {
    $scope.maxPeople = 5;
};

For more information, see AngularJS <input type=number Directive API Reference,

Upvotes: 3

Related Questions