Filter data with .indexOn rules in Firebase realtime database with AngularJS

Question

I'm using FireBase realtime database structure like shown below. and want to extract all model which has red color.

FireBase

{
  "models": {
    "model1": {
      "modelName": "model 1",
      "color": {
        "red": true,
        "blue": true,
        "green": true
      }
    },
    "model2": {
      "modelName": "model 2",
      "color": {
        "yellow": true,
        "blue": true,
        "green": true
      }
    },
    "model3": {
      "modelName": "model 3",
      "color": {
        "red": true,
        "yellow": true,
        "pink": true
      }
    },
    "model4": {
      "modelName": "model 4",
      "color": {
        "red": true,
        "orange": true,
        "white": true
      }
    }
  }
}

i tried using below query but not getting expected result.

AngularJS

let fbRef = firebase.database().ref('models');

fbRef
    .orderByChild('red')
    .equalTo(true)
    .once('value', function(data){
      console.log('result : ', data);
    });

FireBase Rules

{
  "rules": {
    ".read": true,

    "$modelID": {
      ".read": true,
      ".indexOn": ["red", "blue", "green", "orange", "pink", "white", "yellow"]
    }

  }
}

Expected Results

{
  "model1": {
    "modelName": "model 1",
    "color": {
      "red": true,
      "blue": true,
      "green": true
    }
  },
  "model3": {
    "modelName": "model 3",
    "color": {
      "red": true,
      "yellow": true,
      "pink": true
    }
  },
  "model4": {
    "modelName": "model 4",
    "color": {
      "red": true,
      "orange": true,
      "white": true
    }
  }
}

Renaud Tarnec · Accepted Answer · 2019-04-22 09:27:17Z

1

You should order by 'color/red', as follows:

  fbRef
    .orderByChild('color/red')
    .equalTo(true)
    .once('value', function(data) {
      //Use the val() method of the DataSnapshot
      console.log('result : ', data.val());
      //Or loop over children
      data.forEach(function(childSnapshot) {
        var childKey = childSnapshot.key;
        var childData = childSnapshot.val();
        console.log('childKey : ', childKey);
        console.log('childData : ', childData);
      });
    });

Since you get a DataSnapshot, you may either use the val() method to get the result as an object or use forEach() to "enumerates the top-level children in the DataSnapshot". One of the difference between the two ways is that "the ordering of data in the JavaScript object returned by val() is not guaranteed to match the ordering on the server" as explained in the doc.

edited Apr 22, 2019 at 9:27

answered Apr 22, 2019 at 9:17

Renaud Tarnec

83.4k10 gold badges99 silver badges130 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Shiv Kumar Baghel Over a year ago

Thanks for solution @renaud-tarnec ..works like a charm :)

Collectives™ on Stack Overflow

Filter data with .indexOn rules in Firebase realtime database with AngularJS

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related