Параметры AngularJS ng, не отображающие значения

Как я могу отобразить значение следующего списка опций?

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

Ответы

Ответ 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/

Ответ 2

Чтобы он работал, вы (мы) должны изменить способ отправки данных на сервер.

Браузер "глупый", и он не заботится об AngularJS, jQuery или какой-либо другой инфраструктуре JavaScript, делающей магию в коде. Если опция содержит значение индекса вместо реального значения, браузер отправит значение индекса на сервер.

Если вы хотите, чтобы это сработало, вам нужно либо использовать ng-repeat в сочетании с тегом параметра, чтобы отобразить правильные значения, либо отправить данные, вызвав метод .post из контроллера AngularJS.

Вот почему я люблю и ненавижу AngularJS.

Ответ 3

Я понимаю, что это старый вопрос, но у меня тоже была проблема с этим. Моим простым решением было создать скрытый ввод и связать его с помощью ngModel с помощью select. Затем, когда вы делаете обычную форму, отправьте скрытый ввод. Надеюсь, это поможет.

Ответ 4

для альтернативного подхода, мы можем использовать ng-repeat

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