gpt4 book ai didi

javascript - 如何在 Angular 预输入搜索中使用 ng-change

转载 作者:塔克拉玛干 更新时间:2023-11-02 22:31:50 25 4
gpt4 key购买 nike

我想在按键事件中搜索用户列表。我正在使用 customTemplate.js 显示列表,但在第一次按键时没有显示结果列表。

这是我的代码:

<input type="text" placeholder="Search people here..." ng-change="getMatchedUser();"  ng-model="selected" data-typeahead="user as user.name for user in searchMembers | filter:$viewValue" typeahead-on-select="onSelect($item, $model, $label)" typeahead-template-url="customTemplate.html"  /> 

<script type="text/ng-template" id="customTemplate.html">
<a style="cursor: pointer;">
<div class="search-div">
<span style="float: left;"><img ng-src="<?php echo base_url().UPLOAD_PROFILE ?>{{match.model.imageUrl}}" width="30" class="img-circle"></span>
<div class="search-name">
<span>{{match.model.name}}</span><br/>
<span ng-if="match.model.skillName.length">
<i class="skill">{{match.model.skillName}}</i>
</span>
</div>
</div>
<div style="padding-bottom:42px;" ng-if="match.model.length == 5">
<a href="<?php echo base_url(); ?>#/searchResult" style="float: left; padding: 18px 1px 5px 8px; color: black;">
Show More Results
</a>
</div>
</a>
</script>

$scope.getMatchedUser = function(){
$scope.searchValue = $scope.selected;
$http({
method : "POST",
url : BASE_URL + 'getMatchedUser',
data : $.param({"typeValue": $scope.selected}),
headers : { 'Content-Type' : 'application/x-www-form-urlencoded'}
}).success(function(data){
if(data.status == "success"){
$scope.searchMembers = data.searchMembers;
}
});
};

最佳答案

ng-change 实际上是在 ng-model 更新之前触发的。

我找到的一个解决方案是简单地将 typeahead-wait-ms 属性(对于可忽略的时间范围)添加到您的 typeahead input 元素

<input type="text" 
placeholder="Search people here..."
ng-change="getMatchedUser();"
ng-model="selected"
data-typeahead="user as user.name for user in searchMembers | filter:$viewValue"
typeahead-wait-ms=10
typeahead-on-select="onSelect($item, $model, $label)"
typeahead-template-url="customTemplate.html" />

这 10 毫秒的暂停应该足以让 ng-modelng-change 事件被触发之前更新。

关于javascript - 如何在 Angular 预输入搜索中使用 ng-change,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35101281/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com