Угловой-UI Bootstrap Typeahead, несколько выходных?

Question

Итак, я использую Typeahead для получения информации из json-файла. Получил это, чтобы работать, никаких проблем. Но я хотел бы «автозаполнять» несколько других полей ввода, когда я выбрал объект в первом.

Скажем, первое поле выглядит следующим образом:

<input type="text" class="form-control" id="supertag" ng-model="selected" uib-typeahead="title.title for title in tags | filter:$viewValue | limitTo:8"/> 

Он отображает title.title в этом поле ввода, здорово! Я пытался подойти к этой дилемме несколькими способами, но я не могу заполнить остальные поля ввода, когда первый выбран и готов. Я хотел бы иметь что-то вроде title.subtitle на следующем, но, похоже, это не так прямо.

Что мне не хватает? Это не работает, например:

<input type="text" class="form-control" id="rubrik" value="{{title.subtitle}}"/> 

Спасибо!

Edit: JSON выглядит примерно так:

{ 
title: 'title', 
subtitle: 'subtitle', 
id: 'id' 
}, 
{ 
title: 'title', 
subtitle: 'subtitle', 
id: 'id' 
}, 

Edit: Дополнительного код для сравнения между различными файлами JSon.

Так это то, что поле ввода указывает:

$http.get(tagUrl) 
     .then(function(res) { 
      $scope.tags = res.data; 
     }) 

И onSelect:

$scope.onSelect = function($item, $model, $label) { 
     $scope.id = $item.id; 
     $scope.title = $item.title; 
     $scope.selected = $item.selected; 
     $scope.subtitle = $item.subtitle; <- undefined because it only exists in JSON2, not in JSON1. 
     console.log($scope.id); 
    }; 

Вот где я хотел бы функцию, чтобы сделать сравнение по идентификатору входов. Он всегда будет существовать в JSON1 (tagUrl), но я также хочу, чтобы он выглядел, если он существует в JSON2 (superUrl), прежде чем идти дальше (а также, если он существует, установите $ scope.subtitle = $ item.subtitle в соответствующее поле ввода) , Я пробовал разные подходы с операторами if, но в лучшем случае, я не знаю.

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

$http.get(listSuperUrl) 
     .then(function(res) { 
      $scope.current = res.data; 
     }) 

Answer 1

Вам нужно для объявления typeahead-on-select="vm.onSelectItem($item, $model, $label) к входному супертэгов элемента (если вы используете контроллер в качестве VM) или typeahead-on-select="onSelectItem($item, $model, $label) (если вы используете $ объем в контроллере). Вы можете назвать onSelectItem тем, что хотите, это функция, которую я использовал для иллюстрации.

<input type="text" ng-model="subtitle" class="form-control" id="rubrik"/> 

Как только это будет сделано, на ваш взгляд, идти к контроллеру, определите:

vm.onSelectItem = function($item, $model, $label){ 
    /*bind your subtitle ngModel to $item.subtitle*/ 
    vm.subtitle = $item.subtitle; 
} 

или

$scope.onSelectItem = function($item, $model, $label){ 
/*bind your subtitle ngModel to $item.subtitle*/ 
$scope.subtitle = $item.subtitle; 
} 

Это должно сделать это для вас, дайте мне знать, если это Безразлично Так как я не пробовал это в коде.

(не забудьте пометить как ответ, если это помогает!)