bootstrap ui - вводите вперед при выборе, пользовательское значение не отображается

Я пытаюсь добавить функцию автозаполнения с помощью начальной загрузки. когда значение выбирается из списка автозаполнения, я хотел бы добавить «:» в конце выбранного значения. По какой-то причине это добавление не работает.
Мой угловой html-код

<input type="text" ng-model="query" id="search_es"
                       typeahead="v for v in getNext($viewValue) | filter: type_filter"
                       typeahead-on-select='onSelect($item, $model, $label)'
                       autocomplete = "off"
                       placeholder="Type to search..."  />
                <div my-search-directive="search_radar"></div>

Вот код onSelect js

$scope.onSelect = function($item,$model,$label) {
      $scope.query += ": ";
}

Я мог бы зафиксировать значение запроса в другой переменной и отобразить его в пользовательском интерфейсе, но в текстовом поле бутстрапа.

Я использую angular1.4.7 ui-bootstrap-tpls-0.14.3.min.js

Кто-нибудь может помочь.


angularjs typeahead angular-ui-bootstrap
person user2406718    schedule 19.02.2016    source источник
comment
Просто немного изменил ui-bootstrap 0.14.3 typeahead пример plunker с вашей функцией выбора, и это делает то, что вы надеетесь, я думаю. Помогает ли это, или есть ли способ изменить его, чтобы воспроизвести вашу проблему?   -  person Bennett Adams    schedule 19.02.2016
comment
Я очень ценю ваш быстрый ответ. для uib-typeahead вместо использования значений состояний мы можем использовать getLocation? Я пытался изменить, но не смог получить правильный код. что-то вроде того, что у меня было выше getNext($viewValue).   -  person user2406718    schedule 19.02.2016
comment
Я не смог исправить свой код и не смог сломать плунжер, хотя у меня точно такие же значения в onSelect. он никогда не обновляет модель. Последняя надежда, я их тоже загружаю, они вообще взаимодействуют? bootstrap-3.3.6/js/bootstrap.min.js,bootstrap-switch-3.3.2/js/bootstrap-switch.min.js, angular-bootstrap-switch.min.js, ui-bootstrap-tpls-0.14. 3.мин.js   -  person user2406718    schedule 19.02.2016
comment
У меня есть условие ng-if, которое препятствует его добавлению. я исправил это, и теперь это работает. Я хочу отдать должное вашему ответу на примере plunker. Как я это сделал.   -  person user2406718    schedule 19.02.2016
comment
О, круто! Рад, что ты понял это. Я могу опубликовать вышеизложенное в качестве ответа, если хотите.   -  person Bennett Adams    schedule 19.02.2016

Ответы (1)


arrow_upward
2
arrow_downward

Ваша функция $scope.onSelect работает должным образом в этом модифицированном примере плунжера ui-bootstrap. Я так понимаю, вы нашли условие, которое мешало ожидаемому поведению, так что молодец.

person Bennett Adams    schedule 19.02.2016