AngularJS Binding: Dropdown bindet Zeichenfolge, brauche Nummer statt

Ich habe ein Dropdown-Menü, mit dem der Benutzer eine Nummer auswählen kann.AngularJS Binding: Dropdown bindet Zeichenfolge, brauche Nummer statt

<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>

Zurück in meinem Controller, ich den ausgewählten Wert über $ 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

Ich bin neu in Winkel verweisen kann - aus jQuery Ich bin es gewohnt, zu explizite Aufrufen von Number ($ ('# mySelect'). val()), aber in angular ist der Wert automatisch an den $ scope gebunden.

Meine Frage: Gibt es eine Möglichkeit, $ scope.selectedNum zu erzwingen, um Typ Nummer zu sein? In meinem aktuellen Projekt verwende ich die selectedNum, um einige Berechnungen durchzuführen. Ich nehme an, dass ich Number (..) oder parseInt (..) an verschiedenen Stellen verwenden kann, aber ich denke, das könnte ein wenig repetitiv und unordentlich werden.

Quelle

2014-01-30 jlim

Das Problem ist, dass te Optionswert ein CDATA in HTML ist - es ist also ein String in Ihrem Code. Sie können Ihr Problem lösen, wenn Sie eine Array von Zahlen verwenden und die ng-Optionen Richtlinie:

in Controller- Sie hinzufügen können:

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

und in der Ansicht:

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

jetzt finden Sie eine Nummer in Ihrer Controller-Funktion bekommen:

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

Hier ist eine funktionierende Geige: http://jsfiddle.net/5aHRL/

Quelle

2014-01-30 07:09:21 michael

Gute Erklärung, danke! Ich hatte das Gefühl, dass die Verwendung der ng-options-Direktive es lösen würde. – jlim

Kannst du mehr Licht auf den CDATA Teil werfen..danke .. – user1776573

AngularJS Binding: Dropdown bindet Zeichenfolge, brauche Nummer statt

Antwort

Verwandte Themen