Angular Typeahead должен захватить объект

Я пытаюсь использовать Angular Typeahead, и данные, которые я пытаюсь представить, поступают из вызова $http. Это массив таких объектов, как [{"abbrev":"FL", "state":"Florida"}, {"abbrev":"VA", {"state":"Virginia"}]. HTML выглядит так

<input type="text" ng-model="selected" typeahead="item.state for item in states" typeahead-editable="false" />. 

Элемент управления работает в том смысле, что он извлекает список из веб-службы, и когда пользователь выбирает состояние, он правильно заполняет введенный текст и сохраняет имя состояния в переменной $scope.selected. Однако я хочу сохранить объект {"abbrev":"FL", "state":"Florida"}, потому что я хочу сохранить пару ключ/значение в базе данных. Как я могу заставить его выбирать объект, а не только значение?


person Terry H    schedule 06.11.2014    source источник


Ответы (1)


Это можно сделать, сохранив весь объект в $scope.selected. Это будет выглядеть примерно так:

<input type="text" ng-model="selected" typeahead="item for item in states" typeahead-editable="false" typeahead-input-formatter="item.state" typeahead-template-url="results.html" />. 

Изменения, которые необходимо внести, следующие:

  • вернуть весь элемент: typeahead="item for item in states"
  • отформатируйте ввод, чтобы показать состояние: typeahead-input-formatter="item.state"
  • добавить шаблон: typeahead-template-url="results.html"

Затем в своем HTML вы можете определить свой шаблон автозаполнения, чтобы показать имя состояния:

<script type="text/ng-template" id="results.html">
    <a>{{match.model.state}}</a>
</script>
person accraze    schedule 10.10.2015