Можно ли привязать <select> к массиву по индексу в Angular.js?

Скажем, у меня есть это:

$scope.items = ["foo", "bar", "baz"];
$scope.index = 1;

Как связать это с <select>?

Я пробовал: <select ng-model="index" ng-options="i for i in items">, но затем при загрузке выбирается пустой параметр.

Это: <select ng-model="items[index]" ng-options="i for i in items">, похоже, работает изначально, но при изменении выбора значение в элементах [index] изменяется, что явно не то, что мы хотим.

Моим обходным путем является сопоставление массива с парами {num, title}, но эта логика загромождает контроллер.

Ответы

Ответ 1

Попробуйте следующее:

<select ng-model="index" ng-options="i as name for (i, name) in items">

Если вы проверите документацию ng-options, вы увидите, что одна из поддерживаемых форм

выберите как ярлык для значения в массиве

  • select - это то, что должно быть значением модели при выборе этого элемента.
  • label - это текст для отображения

Мы объединили это с группой (key, value), которую вы можете использовать для доступа к ключу в объекте (или в этом случае - индексе в массиве).

Изменить. Я вижу ту же проблему, которую вы видите. В комментариях к документам angular рекомендуется использовать этот подход:

<select ng-model="index" ng-options="items.indexOf(item) as item for item in items">

Какая ИМО не такая чистая, но, похоже, работает.