我有一个数组$scope.something = ['xyz','abc','pqr'];
单击时,我想过滤 ng-repeat
数据,以便返回使用 'xyz'
、'pqr' 过滤后的 JSON 数据
和'abc'
。
ng-repeat="flt_det 中的数据 | 过滤器:某些内容"
。
提前致谢。
最佳答案
如果您想使用 $scope.something
中的任何匹配元素来过滤数据,那么您可能需要创建一个自定义过滤器:
app.filter("somethingFilter", function() {
return function(array, something) {
return array.filter(function(ele) {
return (something.indexOf(ele) > 0)
});
}
});
现在在您的 HTML 中,
ng-repeat="data in flt_det | filter:something".
如果数据存在于 something
数组中,这将过滤 flt_det
。
ON click of a button?
$scope.buttonClickHandler = function() {
$scope.flt_det = $scope.flt_det.filter(function(ele) {
return ($scope.something.indexOf(ele) > 0)
});
}
这将在单击按钮时更新 $scope.flt_det
数据。
在这种情况下,您甚至可以使用 $filter
:
app.controller("myCtrl", function($scope, $filter)
{
$scope.buttonClickHandler = function() {
$scope.flt_det = $filter('somethingFilter')($scope.flt_det,$scope.something);
};
});
EDIT DEMO
angular.module("app",[])
.controller("MainCtrl", function($scope) {
$scope.flt_det = ["abc", "pqr", "sdfs", "sdfds", "xyz"];
$scope.something = ["abc", "pqr", "xyz"];
$scope.buttonClickHandler = function() {
$scope.flt_det = $scope.flt_det.filter(function(ele) {
return ($scope.something.indexOf(ele) > 0)
});
}
});
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body ng-controller="MainCtrl">
<div ng-repeat="data in flt_det">
{{data}}
</div>
<button type="button" ng-click="buttonClickHandler()">Filter data</button>
</body>
</html>
关于javascript - angularjs ng-repeat过滤器基于点击时的数组值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29417989/