Как заполнить select из json, используя angular?

Рейтинг: 3Ответов: 2Опубликовано: 19.11.2014

Добрый день.

Как можно из Json внести данные в <select><Option>...</Option></select>, используя angularjs (либо jquery)?

Есть json ответ типа

[{"id":"5","Year":"2010"},{"id":"6","Year":"2010"},{"id":"7","Year":"2013"}]

Хочу внести его в select.

Спасибо.

Ответы

▲ 4Принят

ng-options

<select ng-model="selected.id" ng-options="item.id as item.Year for item in items">
    <option value=''>Select year</option>
</select>

fiddle


option с ng-repeat

<select ng-model="selected.id">
    <option value="">Select year</option>
    <option value="{{item.id}}" ng-repeat="item in items">{{item.Year}}</option>
</select>

fiddle


Предпочитать ng-options потому, что:

  • можно выбрать другие типы, чем String (однако когда пишем value="{{item.id}}", тип значения атрибута value всегда String)
  • производительность: не создаёт scope для каждого элемента коллекции
  • синтакс яснее
▲ 2

Вам никто не мешает написать Ng-repeat внутри блока Select

<select>
  <option ng-repeat="item in data">{{item}}</option>
</select>

Пример в плунке