How to do ng-repeat on $firebaseArray output with multiple levels? - javascript

I am using $firebaseArray for collecting the data from Firebase. Output is as follows:
[
{
"BankAccount": {
"AccountHolder": "Tom Antony",
"AccountNumber": "56767887"
},
"Info": {
"BillingAddress": {
"City": "XYZ",
"State": "ABC"
},
"FullName": "Tom Antony",
"PhoneNumber": "634762347"
},
"$id": "dGUZX5SWi7aP0SNYLYqEiMdCYAS2",
"$priority": null
},
{
"Campaigns": {
"Settings": {
"Active": true
}
}
},
"Info": {
"BillingAddress": {
"City": "ABC",
"State": "DFG"
},
"FullName": "Mario",
"PhoneNumber": "634762347"
},
"$id": "tBqGZ7g6VwNYOWoVy7C1FHKZKFS2",
"$priority": null
}
]
My js is as follows:
const rootRef = firebase.database().ref().child('Users');
$scope.users = $firebaseArray(rootRef);
Each Array element will have different type of objects, but each will have a similar object called Info, which contains a field for FullName I need to apply ng-repeat on this FullName. My implementation is as shown below:
<div ng-repeat="user in users.Info">
<p ng-bind="user.FullName"></p>
</div>
But its not working. What are the mistakes I made here?

You are trying to iterate on the wrong property. You have two objects (user) which each have an Info property that you want the FullName from. You do not have two Info objects. Therefore, you should be iterating over the users, not iterating over users.Info.
Try this instead:
<div ng-repeat="user in users">
<p ng-bind="user.Info.FullName"></p>
</div>
Also, your object you pasted here wasn't valid JSON, you had an extra }.
Full Working example: http://plnkr.co/edit/ryfjhO0c3egHfKnaL9SQ?p=preview

Related

Create a nested object in CosmosDB (Js)

Building a react native app using CosmosDB and it's SQL api.
Per their documentation, I can add an object to a container like this:
const CosmosClient = require('#azure/cosmos').CosmosClient;
const client = new CosmosClient({ endpoint, key });
const myNewObject = {foo: "bar"}
await client
.database(databaseId)
.container(containerId)
.items.create(myNewObject);
And I can confirm this works.
What I'm trying to do tho, is place data into that {foo: "bar"} document that already exists.
So far I've tried chaining the .item method, but it does't work.
await client
.database(databaseId)
.container(containerId)
.item(idOfMyNewObject) // The existing object I want to create a child in
.item('myNewChildObject') // new child of the parent
.create(newEntry); // new entry in the new child
Any ideas? the documentation doesn't seem to talk about this.
There's no method on the container that does this for you. You must define the structure of the data yourself in your code. Here is an example of a customer record which has both an array of addresses as well as an embedded object.
const customer = {
"id": "000242A2-BF40-4220-864B-2770CAA38F5D",
"type": "customer",
"customerId": "000242A2-BF40-4220-864B-2770CAA38F5D",
"title": "",
"firstName": "Timothy",
"lastName": "Kelly",
"emailAddress": "timothy4#adventure-works.com",
"phoneNumber": "193-555-0189",
"creationDate": "2014-03-14T00:00:00",
"addresses": [
{
"addressLine1": "9918 Scottsdale Rd.",
"addressLine2": "",
"city": "Novato",
"state": "CA ",
"country": "US",
"zipCode": "94947",
"location": {
"type": "Point",
"coordinates": [
-122.764,
38.0852
]
}
}
],
"password": {
"hash": "LvEbgjonEPU11HEeSXqdzTsmqNeUfuhxBNL82vGlCWA=",
"salt": "61626BAE"
},
"salesOrderCount": 1
}

MongoDB aggregate function is not returning the value of collection joined using JavaScript

I needed assistance in order to work out why the aggregate function is not responding the way I'd expect it to respond. This is a RESTful API service I've designed in which I am trying to connect collections with each other. Please note the following:
Collection: Season
{
"_id": {
"$oid": "5c0fc60bfb6fc04dd6ea4e9a"
},
"Season": "1",
"TotalEpisode": "15",
"Name": null,
"Description": "First season with no name for this drama",
"PlayID": "5c0fc4aafb6fc04dd6ea4d81"
}
Collection: Play
{
"_id": {
"$oid": "5c0fc4aafb6fc04dd6ea4d81"
},
"Name": "It was the first time",
"Description": "One of the best action heros in the entertainment industry until this day",
"ReleaseDate": "24/12/2010",
"EndingDate": "12/08/2012",
"Category": "Drama"
}
My implemented code in JavaScript
function getTestLookUp(db, collectionName, response, secondCollectionName){
console.log('First collection name: ' + collectionName + '\n' + 'Second collection name: ' + secondCollectionName);
db.collection(collectionName).aggregate([
{
$lookup:
{
from: secondCollectionName,
localField: 'PlayID',
foreignField: '_id',
as: 'requestedDetails'
}
}
]).toArray((err, res) => {
if(err){
console.log(err);
} else {
console.log(res);
response.status(200).json({
'Items': res
});
}
});
}
The response
{
"Items": [
{
"_id": "5c0fc60bfb6fc04dd6ea4e9a",
"Season": "1",
"TotalEpisode": "15",
"Name": null,
"Description": "First season with no name for this drama",
"PlayID": "5c0fc4aafb6fc04dd6ea4d81",
"requestedDetails": []
}
]
}
The things I've checked so far: the collection names are accurate, the ID is also accurate as I can search it up on the MLabs search feature. I don't understand as to why this is returning a empty 'requestedDetails' as I hoped it would return the item from the Play collection.
In addition to this, I would also appreciate if someone can point out how I can join multiple collections instead of 2.
I welcome any questions regarding this problem.
While still researching for this issue, I accidentally came across a another problem in which someone wrote a comment stating that "you might be comparing a String with ObjectID". This was the cause for this error as I obtain a String variable in return from the database and I am comparing the String variable with the _id which is expecting to see a ObjectID variable to complete the query. Therefore, meaning that my query/lookup is never matching these two variables.
The only way tackle this issue is to do a conversion (string to ObjectID) and then compare the values. However, since I'm using the version of ^3.1.10 of MongoDB, this functionality is not possible. Will need to update the version to 4.0 to be able to implement this functionality.
In order to rectify this issue, I managed to surround the foreign ID within $iod tags.
Before
{
"_id": {
"$oid": "5c0fc60bfb6fc04dd6ea4e9a"
},
"Season": "1",
"TotalEpisode": "15",
"Name": null,
"Description": "First season with no name for this drama",
"PlayID": "5c0fc4aafb6fc04dd6ea4d81"
}
After
{
"_id": {
"$oid": "5c0fc60bfb6fc04dd6ea4e9a"
},
"Season": "1",
"TotalEpisode": "15",
"Name": null,
"Description": "First season with no name for this drama",
"PlayID": {
"$oid": "5c0fc4aafb6fc04dd6ea4d81"
}
}
Response
{
"Items": [
{
"_id": "5c0fc60bfb6fc04dd6ea4e9a",
"Season": "1",
"TotalEpisode": "15",
"Name": null,
"Description": "First season with no name for this drama",
"PlayID": "5c0fc4aafb6fc04dd6ea4d81",
"Details": [
{
"_id": "5c0fc4aafb6fc04dd6ea4d81",
"Name": "It was the first time",
"Description": "One of the best action heros in the entertainment industry until this day",
"ReleaseDate": "24/12/2010",
"EndingDate": "12/08/2012",
"Category": "Drama"
}
]
}
]
}

Delete an object in Scope

This question might not even be related to angularjs and the solution could be plain old js or jquery. But that is what i what to find out.
I want to implement a delete functionality for a particular user and i am wondering if there is a easier way to do this in angularjs or should it be plain old JS?
i have a fairly complex object for eg (going up to 4 levels):
{
"Department": [
{
"Name": "Accounting",
"users": [
{
"id": "1",
"firstName": "John",
"lastName": "Doe",
"age": 23
},
{
"id": "2",
"firstName": "Mary",
"lastName": "Smith",
"age": 32
}
]
},
{
"Name": "Sales",
"users": [
{
"id": "3",
"firstName": "Sally",
"lastName": "Green",
"age": 27
},
{
"id": "4",
"firstName": "Jim",
"lastName": "Galley",
"age": 41
}
]
}
]
}
this is displayed in a ng-repeat where we should Department and username. If I want to delete a particular user i make an api call and on success of it, I want to delete that object. so i have a js method like this
function DeleteUser(user) {
$.each(ctrl.UserData, function(index, value) {
var filteredPeople = value.filter((item) => item.id !== user.id);
});
The question I have is, if i want to delete this object is there any easier way to delete from model since i have the object here or i have to do the classic jquery way of using like $.grep or filter to iterate through each object and match by id and then delete it?
Presumably, you're iterating over the departments (accounting, sales) in your template, and then over the users in that department.
So you could have, in your template:
<button ng-click="deleteUser(user, department)">...</button>
And the method could thus be as simple as
$scope.deleteUser = function(user, department) {
// delete user from backend, then
department.users.splice(departments.users.indexOf(user), 1);
}
If you really don't want to pass the department, then loop over the departments, and use the above if departments.users.indexOf(user) returns a value that is >= 0.

How to get specific array from JSON object with Javascript?

I am working with facebook JS SDK which returns user's information in JSON format. I know how to get the response like response.email which returns email address. But how to get an element from a nested array object? Example: user's education history may contain multiple arrays and each array will have an element such as "name" of "school". I want to get the element from the last array of an object.
This is a sample JSON I got:-
"education": [
{
"school": {
"id": "162285817180560",
"name": "Jhenaidah** School"
},
"type": "H**hool",
"year": {
"id": "14404**5610606",
"name": "2011"
},
"id": "855**14449421"
},
{
"concentration": [
{
"id": "15158**968",
"name": "Sof**ering"
},
{
"id": "20179020**7859",
"name": "Dig**ty"
}
],
"school": {
"id": "10827**27428",
"name": "Univer**g"
},
"type": "College",
"id": "9885**826013"
},
{
"concentration": [
{
"id": "108196**810",
"name": "Science"
}
],
"school": {
"id": "2772**996993",
"name": "some COLLEGE NAME I WANT TO GET"
},
"type": "College",
"year": {
"id": "1388*****",
"name": "2013"
},
"id": "8811215**16"
}]
Let's say I want to get "name": "some COLLEGE NAME I WANT TO GET" from the last array. How to do that with Javascript? I hope I could explain my problem. Thank you
Here is a JsFiddle Example
var json = '{}' // your data;
// convert to javascript object:
var obj = JSON.parse(json);
// get last item in array:
var last = obj.education[obj.education.length - 1].school.name;
// result: some COLLEGE NAME I WANT TO GET
If your json above was saved to an object called json, you could access the school name "some COLLEGE NAME I WANT TO GET" with the following:
json.education[2].school.name
If you know where that element is, then you can just select it as already mentioned by calling
var obj = FACEBOOK_ACTION;
obj.education[2].school.name
If you want to select specifically the last element, then use something like this:
obj.education[ obj.education.length - 1 ].scool.name
Try this,
if (myData.hasOwnProperty('merchant_id')) {
// do something here
}
where JSON myData is:
{
amount: "10.00",
email: "someone#example.com",
merchant_id: "123",
mobile_no: "9874563210",
order_id: "123456",
passkey: "1234"
}
This is a simple example for your understanding. In your scenario of nested objects, loop over your JSON data and use hasOwnProperty to check if key name exists.

How to apply filter in Angular

I am new to Angular and would like to apply filter to this JSON to only get "place" objects.
{
"places": {
"live": "true",
"status": "default",
"place": [
{
"-name": "Test",
"-url": "http://myurl"
},
{
"-name": "Test",
"-url": "http://myurl"
},
{
"-name": "Test",
"-url": "http://myurl"
}
]
}
}
I was thinking of applying filter with something like this:
<div ng-repeat="place in places | filter:{place:'http'}">
This is clearly wrong . Is there a way to apply filter to only get "place" objects
<div ng-repeat="place in places.place">
should work I think

Categories