У меня возникла проблема с установкой выбранного элемента в директиве angular select. Я не знаю, является ли это ошибкой или сознательным дизайном дизайнеров angular. Это, безусловно, делает директиву select намного менее полезной, хотя.
Описание:
Мое приложение связывается с REST API для получения сущности из базы данных. API диктует, что отношения объекта отправляются с идентификационным свойством только для того, чтобы вы могли получить их в последующих запросах, если это необходимо.
Пример:
{ id : 1, customerName : "some name", city : {id : 12}}
где город - это другой объект, который может быть получен через другую конечную точку REST с использованием идентификатора города и выглядит так:
{ id: 12, name : "New York"}
Мне нужно создать форму для редактирования объекта клиента с выпадающим меню со всеми возможными городами, чтобы пользователь мог выбрать город-appopriate из списка. Список должен первоначально отображать город клиента, полученный из объекта JSON.
Форма выглядит следующим образом:
<form>
<input type="text" ng-model="customer.name"/>
<select ng-model="customer.city" ng-options="i as i.name for i in cities"></select>
</form>
И контроллер выглядит следующим образом:
app.controller('MainCtrl', function ($scope, $http) {
$http.get(serviceurl + 'admin/rest/customer/' + id + "/", {
params: {"accept": "json"},
withCredentials: true
}).then(function (response) {
$scope.customer = response.data.item;
});
$http.get(serviceurl + 'admin/rest/city/', {
params: {"accept": "json"},
withCredentials: true
}).then(function (response) {
$scope.cities = response.data.items;
// THIS LINE LOADS THE ACTUAL DATA FROM JSON
$scope.customer.city = $scope.findCity($scope.customer.city);
});
$scope.findCity = function (city) {
for (var i = 0; i < $scope.cities.length; i++) {
if ($scope.cities[i].id == city.id) {
return $scope.cities[i];
}
}
}
});
Что должно произойти: после загрузки полной информации о объекте City директива select должна установить город, который был загружен как выбранный элемент в списке.
Что происходит: в списке отображается пустой элемент, и нет возможности инициализировать выбранный элемент, если выбранный элемент из объектов вне массива элементов.
DEMO проблемы здесь: http://plnkr.co/edit/NavukDb34mjjnQOP4HE9?p=preview
Есть ли для этого решения? Может ли выбранный элемент быть установлен программным способом общим образом, чтобы логические вызовы и выбор логики AJAX были реорганизованы в многократно используемый виджет выбора на основе AJAX?
