In Angular, I need to search objects in an array

All we need is an easy explanation of the problem, so here it is.

In Angular, I have in scope a object which returns lots of objects. Each has an ID (this is stored in a flat file so no DB, and I seem to not be able to user ng-resource)

In my controller:

$ = [
    {category:'freshwater', id:'1', name: 'trout', more:'false'},
    {category:'freshwater', id:'2', name:'bass', more:'false'}

In my view I have additional information about the fish hidden by default with the ng-show more, but when I click the simple show more tab, I would like to call the function showdetails(fish.fish_id).
My function would look something like:

$scope.showdetails = function(fish_id) {  
    var fish = ${id: fish_id});
    fish.more = true;

Now in the the view the more details shows up. However after searching through the documentation I can’t figure out how to search that fish array.

So how do I query the array? And in console how do I call debugger so that I have the $scope object to play with?

How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

Method 1

You can use the existing $filter service. I updated the fiddle above

 $scope.showdetails = function(fish_id) {
     var found = $filter('filter')($, {id: fish_id}, true);
     if (found.length) {
         $scope.selected = JSON.stringify(found[0]);
     } else {
         $scope.selected = 'Not found';

Angular documentation is here

Method 2

I know if that can help you a bit.

Here is something I tried to simulate for you.

Checkout the jsFiddle 😉

Created a filter that you also can use in ‘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;

Usage in controller:

app.controller('SomeController', ['$scope', '$filter', function($scope, $filter) {
     $ = [{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')($, fish_id);
         $scope.selected = JSON.stringify(found);

If there are any questions just let me know.

Method 3

To add to @migontech’s answer and also his address his comment that you could “probably make it more generic”, here’s a way to do it. The below will allow you to search by any property:

.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;

The call to filter would then become:

var found = $filter('getByProperty')('id', fish_id, $;

Note, I removed the unary(+) operator to allow for string-based matches…

Method 4

A dirty and easy solution could look like

$scope.showdetails = function(fish_id) {
    angular.forEach($, function(fish, key) {
        fish.more = == fish_id;

Method 5

Angularjs already has filter option to do this ,

Method 6

Your solutions are correct but unnecessary complicated. You can use pure javascript filter function. This is your model:

     $scope.fishes = [{category:'freshwater', id:'1', name: 'trout', more:'false'},  {category:'freshwater', id:'2', name:'bass', more:'false'}];

And this is your function:

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter({id : fish_id});
         return found;

You can also use expression:

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter(function(fish){ return === fish_id });
         return found;

More about this function: LINK

Method 7

Saw this thread but I wanted to search for IDs that did not match my search. Code to do that:

found = $filter('filter')($, {id: '!fish_id'}, false);

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂

All methods was sourced from or, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply