Repository navigation
Add support for the input type=range #1189
Description
With multiple inputs to the same model <input type="number" /> doesn't play ball. It works as an input but updating it to a value set from another input always fails. Even if the source is also constrained as numeric (type="range" in chrome). This is due to the model being stored as a string.
Demo: http://jsfiddle.net/TXazw/5/Edit
Edit any input except the number and everything updates except the number input. Edit the number input and everything works fine.
A workaround is included. Uncomment parseFloat line and all inputs work correctly.
Should values not be automatically parsed when applied to a number type input? At the very least type="range" should be outputting a number rather than a string.
Discussed in the group:
https://groups.google.com/forum/?fromgroups#!topic/angular/Ecjx2fo8Qvk
Activity
pkozlowski-opensource commentedon Dec 16, 2012
The behavior of the number input type is correct. What could be done here is to add support for the
rangeinput type (so it converts results to a number like the number input type).Even if browsers support for the range isn't great (http://caniuse.com/#search=range) still people would mostly expect a number from the input type range.
metamatt commentedon Apr 24, 2013
I agree; I would expect input(type=range) to yield a number in its ngModel. Thanks for working on this.
btford commentedon Aug 24, 2013
As part of our effort to clean out old issues, this issue is being automatically closed since it has been inactivite for over two months.
Please try the newest versions of Angular (
1.0.8and1.2.0-rc.1), and if the issue persists, comment below so we can discuss it.Thanks!
TylerEich commentedon Nov 23, 2013
As of v1.2.1, the issue persists
mlegenhausen commentedon Dec 3, 2013
Same in v1.2.3.
There is no conversion done from type string to number which should be the expected behaviour.
Please reopen.
nickretallack commentedon Dec 9, 2013
I just ran up against this problem. Very frustrating.
stanleygu commentedon Jan 13, 2014
I encountered this issue where the slider toggle becomes stuck at 0 or 100 if the model is outside that range.
andybak commentedon Jan 20, 2014
It looks like closed tickets are never looked at again so asking nicely to reopen doesn't work. I've reposted this issue here: #5892
feat(input): add input type=range support
Virupax commentedon Dec 16, 2015
div ng-app ng-controller="Ctrl">
Range:
Text:
Select: 00.5 11.5 22.5 33.5 44.5 5
Number:
i: {{i}}
function Ctrl($scope) {
$scope.i=4;
$scope.$watch('i', function() {
//$scope.i = parseInt($scope.i);
});
}
Just change it to parseInt();