從控制器應用分層json對象的角度過濾器js代碼

我是Angualar js和json以及前端dev.so的新手，請原諒我的無知。我想根據property：value過濾json對象。它不包含數組。而property：value總是處於第二級。它是一個分層json而不是數組（parent-> children-> again children）。我看到了相同問題的變體，但其中大部分都是處理數組。下面的是我的示例json。從控制器應用分層json對象的角度過濾器js代碼

  { 
     "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'，那麼我想將它添加到我的最終對象。

這是可行的使用角度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'}});

這一切都沒有工作。我使用控制器js文件中的過濾器。任何幫助表示讚賞。

來源

2017-02-13 d' Scribe

這裏是一個自定義過濾器，以幫助你實現你想要什麼：

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>

希望它有助於

來源

2017-02-13 09:19:24 Jax

獲取運行這樣的錯誤： { 「消息」：「未捕獲的ReferenceError：角沒有定義」，「文件名」：「HTTPS： //stacksnippets.net/js「，」lineno「：33, 」colno「：19 } – otc

從控制器應用分層json對象的角度過濾器js代碼

回答

相關問題