I'm trying to use angular material md-autocomplete directive to display two different things one is popular products and other is auto suggestions but you can only use one md-item for iteration so i decided to use ng-repeat. I used three loops first one on a array that is returning from the getSuggestion() function which itself contains two arrays: an array of popular products objects and an array of suggestions object.
The problem is that now when I'm using up and down key to select an item it is selecting a list of item rather than an individual item and when i click on a particular item i get something like this [object Object],[object Object],[object Object],[objct Object],[object Object],[object Object] in my search box instead of an item string like i would get when i use md-item to iterate either over popular products or suggestions array.
My data is like this:
Object {popular_products: Array[3], suggestion: Array[0], cat_suggestion: Array[0]}
This is my code in controller:
$scope.getSuggestions = function(query) {
$scope.query = query;
return $http.get(url + "?q=" + $scope.query + "&ssize=6&psize=3")
.then(function(response) {
if (typeof response.data === 'object') {
console.log(response.data);
//return $q.resolve(response.data)
return $q.resolve([response.data.suggestion, response.data.popular_products]);
} else {
return $q.reject(response.data); // invalid response
}, function(response) {
return $q.reject(response.data); // Error
});
};
This is my view:
<md-autocomplete
md-no-cache="true"
md-search-text= "query"
md-items="sugg in getSuggestions(query)"
md-item-text="sugg.suggestion"
md-delay="0"
md-min-length="1"
placeholder="Search">
<md-item-template>
<div ng-if="$index == 0">
<div ng-value="item.suggestion" ng-repeat="item in sugg">{{item.suggestion}}</div>
</div>
<div ng-if="$index==1">
<span>
<b>Popular products:</b>
<div ng-value="pp.price" ng-repeat="pp in sugg ">
{{pp.price}}
</div>
</span>
</div>
</md-item-template>
</md-autocomplete>
This is what happens when i hover over a suggestion it highlights a list of suggesitons rather than an individual suggestion:
which leads to this:
