Я пытаюсь построить автозаполнение окна поиска, используя Angular Bootstrap. Когда я начну вводить введенные поля, я хотел бы, чтобы вывод autosuggest (html) был примерно таким:
категории
Изобразительное искусство
наука
математический
курсы
алгебра
биология
картина
Результаты разбиваются на части - категории и курсы, основанные на двух массивах. Это то, что у меня есть для углового контроллера
$scope.courseSearchList = $http.get('api/courses', {cache: false});
$scope.categorySearchList = $http.get('api/categories', {'cache': false});
$q.all([$scope.categorySearchList, $scope.courseSearchList]).then(function(values) {
var a = values[0].data;
var b = values[1].data;
var c = [];
c.push(a);
c.push(b);
console.log(c[0], 'categories');
console.log(c[1], 'courses');
$scope.searchResults = c;
});
поэтому scope.searchResults
будет иметь два массива внутри [[obj],[obj]]
. Первый массив содержит все названия категорий, а второй массив содержит все названия курсов. Область действия называется полем ввода, здесь она ниже
<div class="custom-typehead">
<input type="text" ng-model="selected" placeholder="search a course"
uib-typeahead="items.title for items in searchResults | filter:$viewValue:startsWith" typeahead-template-url="searchResults.html"
typeahead-on-select="onSelect($item, $model, $label)" typeahead-min-length="1" class="form-control" ng-init="">
</div>
<script type="text/ng-template" id="searchResults.html">
<div>
<div>
courses
{{match.model[0].title}}
</div>
<div">
categories
{{match.model[1].title }}
</div>
</div>
</script>
Я знаю, что сценарий и ввод неправильны, но я все еще пытаюсь найти способ разделить результаты на две части, такие как желаемый вывод выше; или, может быть, вы можете предложить лучшее решение этой проблемы. Может ли кто-нибудь помочь мне с этой проблемой? Совершенно новый для Angular и все еще изучающий эту классную структуру.
Ваша помощь будет высоко оценена. Заранее спасибо!
Похоже, вы работаете в ракурсе с угловым бутстрапом. Если это так, эта ссылка может вам помочь.
Вы можете использовать md - автокомпонентный угол материала, это ссылка https://material.angularjs.org/latest/demo/autocomplete
Я надеюсь помочь.