javascript - AngularJS notation in input type range min attribute -


i expect following expression have same outcome:

case 1:

<input type="range" name="myrangeinput" ng-model="value.rangeinput" value="value.rangeinput" min="-55" max="55"> 

case 2 (difference case 1 replaced 55 angularjs scope variables):

<input type="range" name="myrangeinput" ng-model="value.rangeinput" value="value.rangeinput" min="{{value.rangeinputmin}}" max="{{value.rangeinputmax}}"> 

with value.rangeinputmax equals 55 , value.rangeinputmin equals -55.

but not have same output. example let's says value.rangeinput in both cases -10. in 1st example dot in range slider set @ -10. in 2nd example dot set 0. tried convert value.rangeinputmin , value.rangeinputmax numbers , change statement (without double quotes) this:

<input type="range" name="myrangeinput" ng-model="value.rangeinput" value="value.rangeinput" min={{value.rangeinputmin}} max={{value.rangeinputmax}}> 

i tried different notations, e.g. value.rangeinputmin, "value.rangeinputmin", tried set ng-init, create scope variable , assign value in one, etc.

but still showing different behaviour in 1st case.

the problem commented here: https://github.com/driftyco/ionic/issues/1948

jwgmeligmeyling created ngmax , ngmin directives , seem work pretty well:

.directive('ngmin', function() {   return {     restrict : 'a',     require : ['ngmodel'],     compile: function($element, $attr) {       return function linkdatetimeselect(scope, element, attrs, controllers) {         var ngmodelcontroller = controllers[0];         scope.$watch($attr.ngmin, function watchngmin(value) {           element.attr('min', value);           ngmodelcontroller.$render();         })       }     }   } }) .directive('ngmax', function() {   return {     restrict : 'a',     require : ['ngmodel'],     compile: function($element, $attr) {       return function linkdatetimeselect(scope, element, attrs, controllers) {         var ngmodelcontroller = controllers[0];         scope.$watch($attr.ngmax, function watchngmax(value) {           element.attr('max', value);           ngmodelcontroller.$render();         })       }     }   } }) 

here's codepen: http://codepen.io/anon/pen/mkzezb


Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -