AngularJS ng-optionsは値をレンダリングしません

Question

次のオプションリストの値はどのように表示できますか？

$scope.limits = [ {value: '5', text: 'Afficher 5 par page'}, 
        {value: '10', text: 'Afficher 10 par page'}, 
        {value: '15', text: 'Afficher 15 par page'}, 
        {value: '20', text: 'Afficher 20 par page'} 
       ]; 

<select id="limitType" name="limit" ng-model="limit" ng-options="limit.value as limit.text for limit in limits"></select> enregistrement par page 

期待される結果（値に期待= "limit.value"：

<select ng-options="option.value as option.text for option in limits" ng-model="limit" id="limitType" class="ng-pristine ng-valid"> 
    <option value="5" selected="selected">Afficher 5 par page</option> 
    <option value="10">Afficher 10 par page</option> 
    <option value="15">Afficher 15 par page</option> 
    <option value="20">Afficher 20 par page</option> 
</select> 

結果：

<select ng-options="option.value as option.text for option in limits" ng-model="limit" id="limitType" class="ng-pristine ng-valid"> 
    <option value="0" selected="selected">Afficher 5 par page</option> 
    <option value="1">Afficher 10 par page</option> 
    <option value="2">Afficher 15 par page</option> 
    <option value="3">Afficher 20 par page</option> 
</select> 

Answer 1

ng-optionsディレクティブは<options>要素にvalue属性を設定しません。常にシーケンスを使用します。

limit.value as limit.text for limit in limitsは意味：の選択ng-model

チェックこのフィドルにlimit.text

保存limit.value値として<option>のラベルを設定し

• ：http://jsfiddle.net/bmleite/k58Hw/

Answer 2

それを動作させるためには、あなた（データをサーバーに提出する方法を変更する必要があります。

ブラウザは「愚か」で、AngularJS、jQuery、またはコードの背後にある魔法を実行する他のJavaScriptフレームワークは気にしません。オプションに実際の値ではなくインデックス値が含まれている場合、ブラウザはインデックス値をサーバーに送信します。

有効にするには、正しい値を表示するためにng-repeatを使用するか、AngularJSコントローラから.postメソッドを呼び出してデータを送信する必要があります。

これは私が好きな理由です。&嫌いAngularJS。

Answer 3

これは古い質問ですが、私もこれに問題がありました。私の単純な解決策は、非表示の入力を作成し、それをngModelを使ってselectとバインドすることでした。次に、通常のフォーム提出を行うときに、非表示の入力を送信します。お役に立てれば。代替的なアプローチのための

Answer 4

、私たちは、この動作は1は、選択したオプションに文字列や数値だけでなく任意の型のオブジェクトを使用することができます

<select ng-model="limit" id="limitType" class="ng-pristine ng-valid" > 
<option ng-repeat="option in limits " value="{{option.value}}" > 
    {{option.text}} 
</option> 
</select>