Question

我有几个像这样的输入：

<input type='range' min='15' max='{{plan.retirementAge - 1}}' name='age' ng-model='plan.age' />
<input type='range' min='{{plan.age + 1}}' max='90' name='retirementAge' ng model='plan.retirementAge' />

当页面首次加载时，这可正常工作，但如果我更改任一值，则另一个将绑定视为字符串，并将其更改为“37”+ 1 =“371”而不是38.任何人都知道为什么这发生了吗？

Answer 1

这可能是因为Angular尚未像type="range"那样为type="number"实现处理程序，等等。您应该在他们的Github网站上报告此问题（在问题下）。

与此同时，你可以像这样绕过它。也就是说，创建自己的range-model并添加一个解析器到ngModelController，将值转换为数字。

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.angularjs.org/1.0.5/angular.min.js"></script>
    <script>
    angular.module('myApp', []).controller('Ctrl', function($scope) {
        $scope.age = 10;
        $scope.retirementAge = 65;
    })
    .directive('rangeModel', function() {
        return {
            require: 'ngModel',
            link: function($scope, elem, attrs, ctrl) {
                ctrl.$parsers.push(function(val) {
                    return parseInt(val, 10);
                });
            }
        };
    });
    </script>
</head>
<body ng-controller="Ctrl">
    <input type='range' min='15' max='{{retirementAge - 1}}' range-model name='age' ng-model='age' />
    {{age}}
    <input type='range' min='{{age + 1}}' max='90' name='retirementAge' range-model ng-model='retirementAge' />
    {{retirementAge}}
</body>
</html>

AngularJS表达式在更改后将数字转换为字符串

1 个答案: