[英]ng-repeat filter key and Data
我在使用ng-repeat遍历键和数据时遇到麻烦,我在这里有一个小提琴https://jsfiddle.net/prantikv/ddLpfmvh/2/
我有这样的json数据:
{
"container1": {
"value1": "data1",
"value2": "data2",
"value3": "data3",
"value4": "data4",
"value5":{
"innerArray":
[{"innerValue1":"innerData1"},
{"innerValue1":"innerData2"}
]
}
},
"container2": {
"value1": "data1",
"value2": "data2",
"value3": "data3",
"value4": "data4",
"value5":{
"innerArray":
[{"innerValue1":"innerData1"},
{"innerValue1":"innerData2"}
]
}
}
}
我的看法是这样
<input type="text" ng-model="searchInput" />
<ul>
<li data-ng-repeat="(key,value) in reports | filter:searchInput">
{{ key }}</li>
</ul>
我想要实现的是我想过滤键(容器1,容器2等)以及值(值1,值2等)
如何做到这一点? 如果应该的话,我应该更改JSON吗?
使用不是最佳的对象结构,可以使用ng-if
并在控制器中创建一个函数来检查值
<li data-ng-repeat="(key,value) in reports " ng-if="hasSearch(value)" >
我不是100%不清楚您要做什么,并且您的数据样本几乎是重复的,但请看以下内容:
$scope.hasSearch = function(obj){
if(!$scope.searchInput){
return true;
}else{
for (key in obj){
if(typeof obj[key] == 'string' && obj[key].indexOf( $scope.searchInput) >-1){
return true
}
}
return false;
}
}
为了更好地利用角度,我会将您的结构转换为可以排序和过滤的数组,而对象不能
如何做到这一点? 如果应该的话,我应该更改JSON吗?
您可以创建一个自定义过滤器功能,这将需要您将json修改为类似
[{
"containers":[
{
"container":{
"value1":["data1"],
"value2":["data2"],
"name":"container1"
}
},
{
"container":{
"value1":["data3"],
"value2":["data4"],
"name":"container2"
}
}]
}];
您的过滤器可能看起来像这样
app.filter('containerFilter', function(){
return function(objects, criteria){
var filterResult = new Array();
if(!criteria)
return objects;
for(index in objects) {
// add more
if(objects[index].container.name.indexOf(criteria) != -1 ||
objects[index].container.value1.indexOf(criteria) != -1 ||
objects[index].container.value2.indexOf(criteria) != -1 )
filterResult.push(objects[index]);
}
return filterResult;
}
这是演示的链接
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.