一尘不染

AngularJS ng-options不呈现值

angularjs

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

$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

预期结果(预期为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>

结果:

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

阅读 163

收藏
2020-07-04

共1个答案

一尘不染

ng-options指令未value<options>元素上设置属性。它始终使用序列。

使用limit.value as limit.text for limit in limits方式:

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

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

2020-07-04