We Keep Coding

Google Firestore: Filter documents where sub-key is between given value

I am working on a browser game and I have a collection in firestore that looks like this:
{
title: "doc 1",
requirements: {
level: {
min: 2,
max: 3
}
}
},
{
title: "doc 2",
requirements: {
level: {
min: 6,
max: 8
}
}
},
{
title: "doc 3",
requirements: {
level: {
min: 8,
max: 9
}
}
}
Is there any way to query for all documents, that match a given level like when I have a level of 8 I only want to fetch the documents "doc 2" and "doc 3" because the level requirements match?
I tried with something like
ref.where("requirements.level.min", "<=", level);
ref.where("requirements.level.max", ">=", level);
I also tried to change the structure in my documents to this:
{
title: "doc 1",
requirements: {
level: [2, 3]
}
},
{
title: "doc 2",
requirements: {
level: [6, 7, 8]
}
}
and filter it like this
ref.where("requirements.level", "array-contains", level)
But firestore always returns me all documents.

Array contains seems to be correct choice here.
I've checked your example - recreated quite similar structure in my firestore (other doc has same structure but levels from 5 to 7) and run these queries:
const docs = firebase.firestore().collection('docs');
docs.where('requirements.levels','array-contains',2).get().then((snap) => {
console.log(snap.docs.length); //<- outputs 1, correct
});
docs.where('requirements.levels','array-contains',4).get().then((snap) => {
console.log(snap.docs.length); //<- outputs 0, correct
});
docs.where('requirements.levels','array-contains',5).get().then((snap) => {
console.log(snap.docs.length); //<- outputs 1, correct
});

API request for every value in array and return it

I have an array with lots of games that have unique id. I need to make a request for every id to retrieve minutes played for that specific game.
So my array looks something like this:
[
{
id: 1,
name: 'Team 1 vs Team 2'
},
{
id: 2,
name: 'Team 1 vs Team 2'
},
{
id: 3,
name: 'Team 1 vs Team 2'
},
{
id: 4,
name: 'Team 1 vs Team 2'
},
{
id: 5,
name: 'Team 1 vs Team 2'
}
]
I have been trying to forEach through the array, make a request with Axios to the API and then retrieve the data.
The Api looks like this. It is alot more, just narrowed it down. there is an image below with more description:
{
event: {
123123: {
id: 1,
elapsed: {
1: {
elapsed: '45'
}
}
}
}
The elapsed key is unique, for some reason, so I am using a Object.keys to "find" it.
My code:
array.forEach(game => {
axios.get(`http://example.com/${game.id}`)
.then(res => {
let time = 0;
Object.keys(res.data.event).map(eventId) => { //the eventId is the id for the event, in this case 123123.
Object.keys(res.data.event[eventId].elapsed).map(el => {
time = res.data.event[eventId].elapsed[el].elapsed; //el is the key-id for the elapsed object.
)};
)};
return time;
});
});
This does not work, I just get undefined. What am I doing wrong? And yes, the API looks like a mess. I have images below in case that will help you. It's a JSON file, I just have a JSON Formatter:
EDIT: Edited my code

Make a Tree view from JSON data using React JS

First of all i am very new to React JS. So that i am writing this question. I am trying this for three days.
What I have to do, make a list of category, like-
Category1
->Sub-Category1
->Sub-Category2
Categroy2
Category3
.
.
.
CategoryN
And I have this json data to make the listing
[
{
Id: 1,
Name: "Category1",
ParentId: 0,
},
{
Id: 5,
Name: "Sub-Category1",
ParentId: 1,
},
{
Id: 23,
Name: "Sub-Category2",
ParentId: 1,
},
{
Id: 50,
Name: "Category2",
ParentId: 0,
},
{
Id: 54,
Name: "Category3",
ParentId: 0,
},
];
I have tried many open source examples, but their json data format is not like mine. so that that are not useful for me. I have build something but that is not like my expected result. Here is my jsfiddle link what i have done.
https://jsfiddle.net/mrahman_cse/6wwan1fn/
Note: Every subcategory will goes under a category depend on "ParentId",If any one have "ParentId":0 then, it is actually a category, not subcategory. please see the JSON
Thanks in advance.

You can use this code jsfiddle
This example allows to add new nested categories, and do nested searching.
code with comments:
var SearchExample = React.createClass({
getInitialState: function() {
return {
searchString: ''
};
},
handleChange: function(e) {
this.setState({
searchString: e.target.value.trim().toLowerCase()
});
},
isMatch(e,searchString){
return e.Name.toLowerCase().match(searchString)
},
nestingSerch(e,searchString){
//recursive searching nesting
return this.isMatch(e,searchString) || (e.subcats.length && e.subcats.some(e=>this.nestingSerch(e,searchString)));
},
renderCat(cat){
//recursive rendering
return (
<li key={cat.Id}> {cat.Name}
{(cat.subcats && cat.subcats.length) ? <ul>{cat.subcats.map(this.renderCat)}</ul>:""}
</li>);
},
render() {
let {items} = this.props;
let {searchString} = this.state;
//filtering cattegories
if (searchString.length) {
items = items.filter(e=>this.nestingSerch(e,searchString))
console.log(items);
};
//nesting, adding to cattegories their subcatigories
items.forEach(e=>e.subcats=items.filter(el=>el.ParentId==e.Id));
//filter root categories
items=items.filter(e=>e.ParentId==0);
//filter root categories
return (
<div>
<input onChange={this.handleChange} placeholder="Type here" type="text" value={this.state.searchString}/>
<ul>{items.map(this.renderCat)}</ul>
</div>
);
}
});

Filter Json in Code AngularJS

Hello I have the following JSONs
$scope.Facilities=
[
{
Name: "-Select-",
Value: 0,
RegionNumber: 0
},
{
Name: "Facility1",
Value: 1,
RegionNumber: 1
},
{
Name: "Facility2",
Value: 2,
RegionNumber: 1
},
{
Name: "Facility3",
Value: 3,
RegionNumber: 2
}
];
$scope.Regions=
[
{
Name: "-Select-",
RegionNumber: 0
},
{
Name: "USA",
RegionNumber: 1
},
{
Name: "Mexico",
RegionNumber: 2
}
];
I would have two DropdownLists in my app which will have one of these Jsons assigned to it.
Whenever you select a Region, a ng-change would be triggered. What I want, is to make the Facility DDL to update it's values. It would only show the Facilities which have a RegionNumber equivalent to the selected Region's RegionNumber.
How could I achieve this? I'm using Angular JS, MVC...
Note: The -Select- Value must always appear, even if it's value is zero and is not equivalent to the selected Region.

While a data structure, like greengrassbluesky may simplify the result, you can accomplish the same thing with an onchange that leverages javascript filtering
$scope.Facilities = masterFacilities.filter(function (el) {
return regionNumber = el.RegionNumber == $scope.SelectedRegion || el.RegionNumber == 0;
});
Here's a fiddle with an example using your lists.

I think you need a data structure like below:
$scope.Regions=
[
{
Name: "-Select-",
facilities : {
facilityId: 1,
facilityName: "facility1"
},
{
facilityId: 2,
facilityName: "facility2"
}
},
{
Name: "USA",
facilities : [{
facilityId: 1,
facilityName: "facility1"
},
{
facilityId: 2,
facilityName: "facility2"
}]
},
];
So, you could reference them like below:
For the dropdown of Regions, you can iterate through above Data structure.
Store the selectedRegion in selectedRegion
Then use that for the dropdown for facilities.

Custom paging with array of JavaScript objects

I am working on a application which is nicely modularized using requirejs. One of the modules called data service is in charge of providing other modules with data. Pretty much all get* methods of this module return javascript script objects in the the following format:
res = {
totalRows: 537,
pageSize: 10,
page: 15,
rows: [
{
id: 1,
name: 'Angelina'
...
},
{
id: 2,
name: 'Halle'
...
},
{
id: 3,
name: 'Scarlet'
...
},
{
id: 4,
name: 'Rihanna'
...
},
{
id: 5,
name: 'Shakira'
...
},
....
//10 rows
{
id: 10,
name: 'Kate'
...
}
]
}
Is it possible to initialize the data table by providing it with rows for the current page, current page number, page size and the total number of records or pages so that it "knows" which page is currently being displayed as well as the number of available pages. Which in turn would allow the DT to build the pager correctly allowing the user to navigate to other pages in which case we would make another call to data service module to retrieve data from the database for the selected page.