AngularJS在選擇列表中沒有結合數值

Question

我已經與現有的選項標籤現有的select標籤，一個標有「選擇」，例如：

<div class="form-group"> 
    <label class="control-label">Test</label> 
    <select ng-model="vm.testNumber"> 
    <option>Choose...</option> 
    <option value="1">one</option> 
    <option value="2">two</option> 
    <option value="3" selected>three</option> 
    </select> 
    <p class="help-block">{{vm.testNumber}}</p> 
</div> 

角被正確綁定到模型中並吐出「頁面加載時幫助塊中的「3」，但未選擇選項3。如果我爲每個選項的值屬性使用文本，而不是數值時，它將綁定並顯示3。相反，它會在選擇列表頂部插入一個選項：

<option value="? number:3 ?"></option> 

我在做什麼錯？

Answer 1

原來，您需要添加指令才能使其正常工作。 @ codeninja.sj的回答結束了1，2，更換等「一」，「二」在documention，最後的例子有這個指令，convert-to-number

angular.module('app').directive('convertToNumber', function() { 
return { 
    require: 'ngModel', 
    link: function (scope, element, attrs, ngModel) { 
     ngModel.$parsers.push(function (val) { 
      return parseInt(val, 10); 
     }); 
     ngModel.$formatters.push(function (val) { 
      return '' + val; 
     }); 
    } 
}; 
}); 

的文檔中的其他例子無工作爲了我。

更新 @ codeninja.sj的更新答案確實奏效，但是，figure this this directive will cut down magic strings in my code。

Answer 2

從角DOC

注意，如果沒有ngOptions使用的選擇指令的值始終是一個字符串。當模型需要綁定到非字符串值時，您必須顯式地將其轉換或使用ngOptions來指定一組選項。這是因爲選項元素目前只能綁定到字符串值。

如果您像下面的代碼片段一樣更改代碼，則不需要執行任何顯式字符串轉換。

<select ng-model="vm.testNumber" ng-options="item.value as item.label for item in [{label: 'one', value: 1}, {label: 'two', value: 2}]"> 
    <option value="">Choose...</option> 
    </select>