AngularJS Binding：Dropdown绑定字符串,需要编号

我有一个下拉列表,允许用户选择一个数字.

<body ng-app="myApp">
    <div ng-controller="MyCtrl">
        <select ng-model="selectednum" ng-change="numberSelected()">
            <option value="10">10</option>
            <option value="20">20</option>
            <option value="30">30</option>
            <option value="40">40</option>
            <option value="50">50</option>
        </select>
    </div>
</body>

回到我的控制器中,我可以通过$scope.selectednumber引用所选的值

angular.module('myApp',[]).controller('MyCtrl',function($scope) {

    $scope.selectednum = 10;

    $scope.numberSelected = function(){
        alert(typeof $scope.selectednum); //alerts string,need this to be a number
    }
});

Working Fiddle

我是角色的新手 – 来自jQuery我习惯于显式调用Number($(‘#mySelect’).val())但是在角度中,值会自动绑定到$scope.

我的问题：有没有办法强制$scope.selectednum为类型号？在我的实际项目中,我使用selectednum进行一些计算.我想我可以在各个地方使用Number(..)或parseInt(..),但我认为这可能会有点重复和混乱.

解决方法

问题是te选项值是HTML中的CDATA – 因此它是代码中的字符串.如果您使用数字数组和ng-options指令,您可以解决您的问题：

在您的控制器中,您可以添加：

$scope.nums = [10,20,30,40,50];

在你看来：

<select 
      ng-model="selectednum" 
      ng-change="numberSelected()" 
      ng-options="n for n in nums">
</select>

现在你的控制器功能中会有一个数字：

$scope.numberSelected = function(){
   console.log(typeof $scope.selectednum,$scope.selectednum);
}

这是一个工作小提琴：http://jsfiddle.net/5aHRL/

AngularJS Binding：Dropdown绑定字符串,需要编号

解决方法

相关文章