Можно ли использовать директиву AngularUI Bootstrap typeahead для получения предложений только для последнего слова в предложении?
Например: если пользователь вводит «Red Ca», предложение должно быть чем-то вроде «Car, Carousel, Candle», независимо от того, какое слово стояло перед «Ca»?
Конечно, когда пользователь выбирает «Автомобиль», результатом должен быть «Красный автомобиль». Он не должен заменять все содержимое ввода.
Здесь есть 2 проблемы, чтобы заставить его работать:
1) легко решается с помощью пользовательской функции для фильтрации предлагаемых значений:
$scope.containsLastWord = function(state, viewValue) {
var words = viewValue.split(" ");
var currentWord = words[words.length - 1];
return state.substr(0, currentWord.length).toLowerCase() == currentWord.toLowerCase();
}
И в вашем typeahead:
typeahead="name for name in states | filter:$viewValue:containsLastWord"
2) сложнее, потому что вы не можете поймать событие select до того, как оно изменит модель. Поэтому мне пришлось отслеживать старое значение модели и изменять значение модели после выбора пользователя:
var typeaheadLastValue = "";
$scope.$watch('selected', function(newVal, oldVal) {
typeaheadLastValue = oldVal || "";
});
$scope.typeaheadOnSelect = function(item) {
var words = typeaheadLastValue.split(" ");
words[words.length - 1] = item;
$scope.selected = words.join(" ");
}
И в вашем typeahead:
typeahead-on-select="typeaheadOnSelect($item)"
Загрузите сюда: http://plnkr.co/edit/hutiNW5s58MfNBap0p1Z?p=preview
PS: этот код не обрабатывает случай, когда предложения содержат " "
