我正在尝试开发angularjs过滤器,但我无法在下面的代码中得到结果,只显示一个范围过滤器。我该如何解决?如何使用下拉框值过滤。它过滤两种类型,如选择框过滤器和文本框值过滤器
<html >
<head>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<title>search</title>
</head>
<body>
<div ng-app="app" ng-controller="mainCtrl">
<div>Search by Name: <input type="text" ng-model="filters.search"></div>
<div>
<select ng-model="selectedCompany" >
<option ng-repeat="xi in array" value="{{xi.company}}">{{xi.company}}</option>
</select>
</div>
<div ng-repeat="arr in array | filter:filters.search | filter:{company: filters.company}">
<span ng-bind="arr.name"></span>
</div>
<h1>You selected: {{selectedCompany}}</h1>
</div>
<script type="text/javascript" src="js/angular.min.js"></script>
<script src="js/ui-bootstrap-tpls-0.9.0.js"></script>
<script type="text/javascript">
var app = angular.module('app', []);
app.controller('mainCtrl', function($scope) {
$scope.filters = {
x: false,
company: '',
search: ''
};
$scope.actions = {
updateyCompany: function () {
if($scope.filters.y) {
$scope.filters.company = 'y';
} else {
$scope.filters.company = '';
}
}
};
$scope.array = [
{name: 'Tobias', lname: 'TLname', company: 'x'},
{name: 'Jeff', lname: 'JLname', company: 'x'},
{name: 'Brian', lname: 'BLname', company: 'x'},
{name: 'Igor', lname: 'ILname', company: 'y'},
{name: 'James', lname: 'JLname', company: 'z'},
{name: 'Brad', lname: 'BLname', company: 'y'}
];
});
</script>
</body>
</html>
谢谢@basil
答案 0 :(得分:0)
只需进行以下更改,它应该有效(您已将选择绑定到“selectedCompany”,因此必须在您的过滤器中使用它):
<div ng-repeat="arr in array | filter:filters.search | filter:{company: selectedCompany}">
<span ng-bind="arr.name"></span>
</div>