Question

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

<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（..），但我认为这可能会有点重复和混乱。

Answer 1

问题是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绑定字符串，需要编号

1 个答案: