我在表数据中进行了搜索过滤,但参数始终为'undefined'
我将它与 ng-repeat 一起使用
<input type="text" ng-model="searchText" class="form-control" translate="Search">
<tr ng-repeat="g in StudentList | SearchFilter:searchText >
和过滤器:
app.filter('SearchFilter', function () {
return function (input, word) {
if (word == undefined || word == '')
return input;
// filtering ...
}
});
我在Chrome浏览器上使用AngularJS v1.5.8
答案 0 :(得分:0)
根据您在tr元素中使用的过滤器,它只接受一个参数。如果要传递两个参数,则应将过滤器更改为
<tr ng-repeat="g in StudentList | filter:filterUser(searchText, word)>
$scope.filterUser = function(input, word) {
return function (input, word) {
if (word == undefined || word == '')
return input;
// filtering ...
}
}
但我不明白为什么在这种情况下你需要一个自定义过滤器,你可以这样做,
<input type="text" ng-model="searchText" >
<tr ng-repeat="g in StudentList | filter:searchText">
答案 1 :(得分:0)
要过滤普通对象,您不需要自定义过滤器。像这个例子一样使用filter:searchText
:
var app=angular.module('app',[])
app.controller('Ctrl',function($scope){
$scope.StudentList=[
{ id: 1, name: 'John', address: 'Highway 71'},
{ id: 2, name: 'Peter', address: 'Lowstreet 4'},
{ id: 3, name: 'Amy', address: 'Apple st 652'},
{ id: 4, name: 'Hannah', address: 'Mountain 21'},
{ id: 5, name: 'Michael', address: 'Valley 345'},
{ id: 6, name: 'Sandy', address: 'Ocean blvd 2'},
{ id: 7, name: 'Betty', address: 'Green Grass 1'},
{ id: 8, name: 'Richard', address: 'Sky st 331'},
{ id: 9, name: 'Susan', address: 'One way 98'},
{ id: 10, name: 'Vicky', address: 'Yellow Garden 2'},
{ id: 11, name: 'Ben', address: 'Park Lane 38'},
{ id: 12, name: 'William', address: 'Central st 954'},
{ id: 13, name: 'Chuck', address: 'Main Road 989'},
{ id: 14, name: 'Viola', address: 'Sideway 1633'}
];
})
table{
border-collapse:collapse;
width:100%
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<div ng-app="app" ng-controller="Ctrl">
<input ng-model="searchText">
<table border=1>
<tr><th>Id</th><th>Name</th><th>Ardress</th></tr>
<tr ng-repeat="g in StudentList|filter:searchText"><td>{{g.id}}</td><td>{{g.name}}</td><td>{{g.address}}</td></tr>
</table>
</div>