AngularJS ng-options 不呈现值 [英] AngularJS ng-options not rendering values

问题描述

如何呈现以下选项列表的值?

$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>注册标准页

预期结果(在 value="limit.value" 中预期:

<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></选择>
结果:
<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></选择>

解决方案

ng-options 指令没有设置 上的 value 属性; 元素.它总是使用一个序列.

使用 limit.value 作为 limit.text for limit in limits 意味着:

• 设置的标签为limit.text
• 将 limit.value 值保存到选择的 ng-model

检查这个小提琴:http://jsfiddle.net/bmleite/k58Hw/

How can I render the value of the following options list?

$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

Expected result (expecting in value="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>

Result:

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

解决方案

The ng-options directive does not set the value attribute on the <options> elements. It always uses a sequence.

Using limit.value as limit.text for limit in limits means:

• Set the <option>'s label as limit.text
• Save the limit.value value into the select's ng-model

Check this fiddle: http://jsfiddle.net/bmleite/k58Hw/

这篇关于AngularJS ng-options 不呈现值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！