gpt4 book ai didi

javascript - AngularJS 过滤多个参数

转载 作者:行者123 更新时间:2023-11-28 15:54:36 26 4
gpt4 key购买 nike

我有一个由 $scope 填充的表格以及标题中的两个搜索文本框,我用它们来过滤用户名和电子邮件:

<table class="table">
<thead>
<tr>
<th></th>
<th><input type="search" placeholder="Search" ng-model="searchName"></th>
<th><input type="search" placeholder="Search" ng-model="searchMail"> </th>
<th></th>
</tr>
<tr>
<th>ID</th>
<th>Name</th>
<th>email</th>
<th>password</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="q in dataForTable | filter:{user_fullname : searchName, user_email : searchMail}">
<td>{{q.user_id}}</td>
<td>{{q.user_fullname}}</td>
<td>{{q.user_email}}</td>
<td>{{q.user_password}}</td>
</tr>
</tbody>

dataForTable 通过 $http 来自 Controller :

$http.get('http://tbrzica.comli.com/rest/index.php/simple/users').success(function(data){
$scope.dataForTable=data;
});

但是当页面最初加载时,表是空的。仅当我在文本框中写入内容并删除输入时,才会填充表格并且按两个条件进行搜索才能正常工作。这是某种错误吗?
提前致谢。

编辑:找到解决方案:

我需要在 Controller 内初始化两个 ng-model 参数:

$scope.searchName="";
$scope.searchhMail="";

tymeJV,谢谢您的回答。

最佳答案

在 Controller 中,您可以为过滤器创建作用域函数,如下所示:

$scope.filterUser = function(fullName, email) {
return function(user) {
return (fullName == undefined || fullName.length == 0 || user.user_fullname == fullName)
&& (email == undefined || email.length == 0 || user.user_email == email);
}
}

在 HTML 中,您可以应用以下过滤器:

<tr ng-repeat="q in dataForTable | filter:filterUser(searchName, searchMail)">
<td>{{q.user_id}}</td>
<td>{{q.user_fullname}}</td>
<td>{{q.user_email}}</td>
<td>{{q.user_password}}</td>
</tr>

希望这有帮助!

关于javascript - AngularJS 过滤多个参数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19348377/

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