I have an array of objects, and Now I am trying to select the data. Enclosed file is a snapshot of the object I am getting in console.
I want to get the emailid even if user search by the empid or empname or emailid from the object in autocomplete. But I am unable to retrieve this one when I start typing in md-autocomplete
my screen blinks and never gave me list of filter items.
code : 代码:
<md-autocomplete flex required
md-search-text="searchText"
md-input-name="autocomplete"
md-search-text-change="searchTextChange(searchText)"
md-items="item in search(searchText)"
md-item-text="item"
md-floating-label="Reporting Manager">
<md-item-template>
<span md-highlight-text="searchText" md-highlight-flags="^i">{{item.empname}}</span>
</md-item-template>
</md-autocomplete>
And this is my javascript search()
function
$scope.search = function(text){
var deferred = $q.defer()
var result = []
var resolve = function(reportingManager){
//console.log(reportingManager)
angular.forEach(reportingManager,function(val){
//console.log(val)
angular.forEach(val,function(value){
//console.log(value)
if(value.empid.toUpperCase().includes(text.toUpperCase())
|| value.empname.toUpperCase().includes(text.toUpperCase())){
result.push(value.empname)
//console.log(result)
}
})
})
deferred.resolve(result)
}
if(text){
resolve(reportingManager? reportingManager: [])
}else{
resolve([]);
}
return deferred.promise
}
reportingManager is an array of arrays which has the objects which i have included in the snapshot. Any help on this one would be highly appreciable
Regards
First of all I would like to thank @ Titus for being there for me and walking with me to solve my problem.
The issue was not only with Javascript code it was also with CSS. Since I was trying to put the md-autocomplete
in a modal pop up after so many trials the autocomplete suggestions were coming up but it was behind the modal. Here is the working code
$scope.search = function(text){
var deferred = $q.defer()
var result = []
var resolve = function(reportingManager){
//console.log(reportingManager)
angular.forEach(reportingManager,function(val){
//console.log(val)
angular.forEach(val,function(value){
//console.log(value)
if(value.empid.toUpperCase().includes(text.toUpperCase())
|| value.empname.toUpperCase().includes(text.toUpperCase())){
result.push(value.emailid)
//console.log(result)
}
})
})
deferred.resolve(result)
}
if(text){
resolve(reportingManager? reportingManager: [])
}else{
resolve([]);
}
return deferred.promise
}
HTML :
<div class="md-virtual-repeat-container">
<md-autocomplete flex required
md-search-text="searchText"
md-input-name="autocomplete"
md-search-text-change="searchTextChange(searchText)"
md-items="item in search(searchText)"
md-item-text="item"
md-selected-item="selectedManager"
md-floating-label="Reporting Manager">
<md-item-template>
<span md-highlight-text="searchText" md-highlight-flags="^i">{{item}}</span>
</md-item-template>
</md-autocomplete>
</div>
In case you are trying to get the autocomplete in a pop up don't forget to set the high value for z-index
如果您尝试在弹出窗口中获取自动完成功能,请不要忘记为z-index
设置较高的值
And also include the $q
in your controller
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.