角度Js在控制器中过滤嵌套数组
问题描述:
我想在控制器中使用angularjs过滤器过滤嵌套数组。 以下是我的样本数据角度Js在控制器中过滤嵌套数组
dummy=[
{
category:'TV',
data:[
{
title: 'Game of Thrones',
path: 'some data1',
},
{
title: 'Game of Thrones-SD',
path: 'some data2'
},
{
title: 'Game of Thrones-HD',
path: 'some data3'
},
{
title: 'Game of Thrones-Trailer 1',
path: "some data4"
},
{
title: 'Game of Thrones-Trailer 2',
path: "some data5"
},
{
title: 'Game of Thrones-Trailer 3',
path: "Ssome data6"
},
{
title: 'The Vampire Diaries ',
path: 'some data7'
},
{
title: 'The Vampire Diaries -SD',
path: 'some data8'
},
{
title: 'The Vampire Diaries -HD',
path: 'some data9'
},
{
title: 'The Vampire Diaries -Trailer 1',
path: 'some data10'
}
]
},
{
category:'LIVE',
data:[
{
title: 'Game of Thrones - Live Show',
path: 'some data11'
},
{
title: 'The Vampire Diaries - Live Show',
path: 'some data11'
}
]
}
];
例如我要过滤的标题数据,所以如果我搜索“权力的游戏”我希望得到以下数据
{
category:'TV',
data:[
{
title: 'Game of Thrones',
path: 'some data1',
},
{
title: 'Game of Thrones-SD',
path: 'some data2'
},
{
title: 'Game of Thrones-HD',
path: 'some data3'
},
{
title: 'Game of Thrones-Trailer 1',
path: "some data4"
},
{
title: 'Game of Thrones-Trailer 2',
path: "some data5"
},
{
title: 'Game of Thrones-Trailer 3',
path: "Ssome data6"
},
]
},
{
category:'LIVE',
data:[
{
title: 'Game of Thrones - Live Show',
path: 'some data11'
}
]
}
我认为类似的问题已经在这里问 Angularjs filter nested object
,我试图用下面的代码在我的控制器,但它并没有奏效
var filterdData = $filter('filter')(content, {data: [{title: $scope.filterKey}]});
答
快速回答:
您的屏幕应该是这样的:
<td filter="{'Object.InnerObject': 'text'}">{{row.Object.InnerObject}}</td>
在您的控制器:
添加此功能ngTable的过滤器转换成JSON对象AngularJS Filter理解。
var treatJSON = function(malformedJson){
var treatedFilters = {};
var subObjects = [];
var auxiliarObject;
var objectName;
var objectValue;
var keys = Object.keys(malformedJson);
for(var index = 0; index < keys.length; index++){
auxiliarObject = null;
subObjects = keys[index].split('.');
// Go adding the layers from bottom to up
for(var innerIndex = subObjects.length - 1; innerIndex >= 0 ; innerIndex--){
// Recovery the name and the value of actual object
objectName = subObjects[innerIndex];
objectValue = auxiliarObject || malformedJson[keys[index]];
// Add the objet to the treated filters or add it to the chain for the next object to use it
if(innerIndex == 0){
treatedFilters[objectName] = objectValue;
} else {
auxiliarObject = {};
auxiliarObject[objectName] = objectValue;
}
}
}
return treatedFilters;
};
和更改的getData函数使用上面的功能:
getData: function($defer, params) {
var filteredRecords =
params.filter()
? $filter('filter')($scope.records, treatJSON(params.filter()))
: $scope.records;
$defer.resolve(filteredRecords.slice((params.page() - 1) * params.count(), params.page() * params.count()));
params.total(filteredRecords.length);
}
更详细的解答:
我有同样的问题,并解决它创建一个函数分解视图传递的对象。
问题是由ngTable解析的对象。
当ngTable在filter属性上找到一个复杂对象时,它不会解析对象,返回一个扁平的字符串。 例:
这种复杂的滤波器
<td filter="{'Object.InnerObject': 'text'}" class="text-right">
将然而AngularJS滤波器需要一个良好形成复杂的对象过滤字段作为返回
{'Object.InnerObject': ""}
。 然后函数只是互感器的最后一个例子是:
{
'Object':
{
'InnerObject': ""
}
}
希望它能帮助。
答
这个工作对我来说
var filterdData = $filter('filter')(content, {data: {title: $scope.filterKey}});
+0
请编辑更多信息。仅限代码和“尝试这个”的答案是不鼓励的,因为它们不包含可搜索的内容,也不解释为什么有人应该“尝试这个”。我们在这里努力成为知识的资源。 – abarisone 2016-06-24 06:59:43
有什么理由你需要使用$过滤器?你不能只使用自定义过滤器功能吗? – 2015-02-08 10:23:03
AngularJS版本? – tasseKATT 2015-02-08 15:20:48
@tasseKATT:是角度版本的一个 – 2015-02-08 18:13:22