我是 Angualar js 和 json 以及前端开发的新手。所以请原谅我的无知。我想根据 property:value 过滤 json 对象。 它不包含数组。并且 property:value 始终位于第二级。它是一个分层 json，而不是一个数组(父级->子级->再次子级。)。 我见过同一问题的变体，但大多数都在处理数组。 下面是我的示例 json。
{
"key1":
{
"prop11": "value11",
"prop2" : "N",
"prop13" : "value13"
},
"key2":
{
"prop21": "value21",
"prop2" : "Y",
"prop33" : "value23"
},
"key3":
{
"prop31": "value11",
"prop33" : "value13",
"prop2" : "N",
},
"key4":
{
"prop41": "value21",
"prop2" : "Y",
"prop43" : "value23"
},
.
.
.
.
}
我想根据prop2的值将所有子项过滤到一个json对象中。 也就是说，如果 prop2 : 'Y'，那么我想将它添加到我的最终对象中。
这可以使用 Angular js 过滤器吗？ 我尝试了下面的示例，但无法获得所需的结果。
$filter('filter')(JSON.parse(jsonString),JSON.parse("{ \"Mandatory\":\"Y\"}"))
or
$filter('filter')(JSON.parse(jsonString),JSON.parse("{$:{Mandatory:'y'}}"))
或者我尝试通过添加方括号将示例 json 字符串转换为包含单个对象的数组。
var array = '[ '+ jsonString + ' ]';
$filter('filter')(array,{$:{Mandatory:'y'}});
这些都不起作用。我正在使用 Controller js 文件中的过滤器。 任何帮助表示赞赏。
最佳答案
这里是一个自定义过滤器，可以帮助您实现您想要的目标:
app.filter('myFilter', function() {
return function(data) {
newObj = [];
angular.forEach(data, function(v, k) {
if(v.prop2 === 'Y') {
newObj.push(v);
}
});
return newObj;
}
});
这是实现，我只是将您的数据分配给 $scope 上的变量，然后显示数据并通过执行 {{data | } 来应用过滤器。 myFilter}}。
您可以运行代码片段来查看其实际效果。
var app = angular.module('ngApp', []);
app.controller('MainCtrl', ['$scope', function($scope) {
$scope.data = {
"key1": {
"prop11": "value11",
"prop2": "N",
"prop13": "value13"
},
"key2": {
"prop21": "value21",
"prop2": "Y",
"prop33": "value23"
},
"key3": {
"prop31": "value11",
"prop33": "value13",
"prop2": "N",
},
"key4": {
"prop41": "value21",
"prop2": "Y",
"prop43": "value23"
}
}
}]);
app.filter('myFilter', function() {
return function(data) {
newObj = [];
angular.forEach(data, function(v, k) {
if(v.prop2 === 'Y') {
newObj.push(v);
}
});
return newObj;
}
});<!DOCTYPE html>
<html ng-app="ngApp">
<head lang="en">
<meta charset="utf-8">
<title>maxisam's ngApp</title>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.0/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<script>
document.write('<base href="' + document.location + '" />');
</script>
</head>
<body ng-controller="MainCtrl" class="container">
{{data | myFilter}}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script>
<script src="app.js"></script>
</body>
</html>希望对你有帮助
关于javascript - 使用 Controller js 代码中的分层 json 对象应用 Angular Filter，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42200053/