在Angular中,我在范围内有一个返回大量对象的对象。每个都有一个ID(这是存储在一个平面文件中,所以没有DB,我似乎无法用户ng-resource
)
在我的控制器中:
$scope.fish = [
{category:'freshwater', id:'1', name: 'trout', more:'false'},
{category:'freshwater', id:'2', name:'bass', more:'false'}
];
在我看来,我有更多关于隐藏的鱼的信息,默认情况下隐藏了ng-show
,但当我点击简单显示更多标签时,我想调用函数showdetails(fish.fish_id)
。
我的功能看起来像:
$scope.showdetails = function(fish_id) {
var fish = $scope.fish.get({id: fish_id});
fish.more = true;
}
现在在视图中显示的详细信息更多。但是,在搜索完文档之后,我无法弄清楚如何搜索fish
数组。
那么如何查询数组呢?在控制台中如何调用调试器以便我可以使用$scope
对象?
答案 0 :(得分:211)
您可以使用现有的$ filter服务。我更新了http://jsfiddle.net/gbW8Z/12/
之上的小提琴 $scope.showdetails = function(fish_id) {
var found = $filter('filter')($scope.fish, {id: fish_id}, true);
if (found.length) {
$scope.selected = JSON.stringify(found[0]);
} else {
$scope.selected = 'Not found';
}
}
Angular文档在这里http://docs.angularjs.org/api/ng.filter:filter
答案 1 :(得分:95)
我知道这是否对你有所帮助。
这是我试图为你模拟的东西。
结帐jsFiddle;)
http://jsfiddle.net/migontech/gbW8Z/5/
创建了一个过滤器,您也可以在'ng-repeat'
中使用它app.filter('getById', function() {
return function(input, id) {
var i=0, len=input.length;
for (; i<len; i++) {
if (+input[i].id == +id) {
return input[i];
}
}
return null;
}
});
控制器中的用法:
app.controller('SomeController', ['$scope', '$filter', function($scope, $filter) {
$scope.fish = [{category:'freshwater', id:'1', name: 'trout', more:'false'}, {category:'freshwater', id:'2', name:'bass', more:'false'}]
$scope.showdetails = function(fish_id){
var found = $filter('getById')($scope.fish, fish_id);
console.log(found);
$scope.selected = JSON.stringify(found);
}
}]);
如果有任何问题,请告诉我。
答案 2 :(得分:22)
要添加@ migontech的答案以及他的评论,他的评论可能“可能使其更通用”,这是一种方法。以下将允许您搜索任何属性:
.filter('getByProperty', function() {
return function(propertyName, propertyValue, collection) {
var i=0, len=collection.length;
for (; i<len; i++) {
if (collection[i][propertyName] == +propertyValue) {
return collection[i];
}
}
return null;
}
});
对过滤器的调用将变为:
var found = $filter('getByProperty')('id', fish_id, $scope.fish);
注意,我删除了一元(+)运算符以允许基于字符串的匹配...
答案 3 :(得分:13)
肮脏而简单的解决方案看起来像
$scope.showdetails = function(fish_id) {
angular.forEach($scope.fish, function(fish, key) {
fish.more = fish.id == fish_id;
});
};
答案 4 :(得分:7)
Angularjs已经有了过滤选项来做到这一点, https://docs.angularjs.org/api/ng/filter/filter
答案 5 :(得分:7)
您的解决方案是正确的,但不必要的复杂。您可以使用纯javascript过滤功能。这是你的模特:
$scope.fishes = [{category:'freshwater', id:'1', name: 'trout', more:'false'}, {category:'freshwater', id:'2', name:'bass', more:'false'}];
这是你的功能:
$scope.showdetails = function(fish_id){
var found = $scope.fishes.filter({id : fish_id});
return found;
};
您也可以使用表达式:
$scope.showdetails = function(fish_id){
var found = $scope.fishes.filter(function(fish){ return fish.id === fish_id });
return found;
};
有关此功能的更多信息:LINK
答案 6 :(得分:4)
看到这个帖子,但我想搜索与我的搜索不匹配的ID。代码来做到这一点:
found = $filter('filter')($scope.fish, {id: '!fish_id'}, false);