Storing information in firebase using data structuring

While I initially passed an array to Firebase to store data, it proved to be inefficient when querying the data. As a result, I am now considering storing the data in mapping format. However, I am unsure of how to proceed with this.

{
   "ClassDetails": 
     [
       {
         "Code": "CIS695",
         "Instructor": "Dr. Antony",
         "Location": "BB444",
         "Name": "Capstone project"
       }
     ],
   "PersonalDetials": [
       {
         "Email": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="c2b0b1aaa3aaf082afb7b0b0a3bbb1b6a3b6a7eca7a6b7">[email protected]</a>",
         "FName": "Ravi",
         "LName": "Shah",
         "Major": "MSIS"
       }
     ]
 }

I aim to restructure the data into the following format:

{
   "ClassDetails": 
     "CIS695":{
       "Code": "CIS695",
       "Instructor": "Dr. Antony",
       "Location": "BB444",
       "Name": "Capstone project"
       }
       "CIS690":{
       "Code": "CIS690",
       "Instructor": "Dr. Smith",
       "Location": "BB444",
       "Name": "Project Management"
       }
   "PersonalDetials": 
     {
       "Email": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ccbebfa4ada4fe8ca1b9bebeadb5bfb8adb8a9e2a9a8b9">[email protected]</a>",
       "FName": "Ravi",
       "LName": "Shah",
       "Major": "MSIS"
     }
 }

Despite trying various methods, a proper solution has eluded me.Here is the current data structure in Firebase

angulartypescriptfirebaseionic-frameworkgoogle-cloud-firestore

Answer №1

When looking at the static nature of the data structure, you can experiment with this approach:

const data = {
  "ClassDetails": [{
    "Code": "CIS695",
    "Instructor": "Dr. Antony",
    "Location": "BB444",
    "Name": "Capstone project"
  }],
  "PersonalDetials": [{
    "Email": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="e290918a838ad0a28f979090839b9196839687cc878697">[email protected]</a>",
    "FName": "Ravi",
    "LName": "Shah",
    "Major": "MSIS"
  }]
};

const mappedData = { ...data
};
mappedData.ClassDetails = {};
for (const item in data.ClassDetails) {
  const itemToAdd = { ...data.ClassDetails[item]
  };
  mappedData.ClassDetails[itemToAdd.Code] = itemToAdd;
}
mappedData.PersonalDetials = mappedData.PersonalDetials[0];

console.log(mappedData);

Answer №2

Here is a suggestion for you:

  let results = {};
  constructor() {
    let details = {};
    this.input.Details.forEach(element => {
      details[element.Code] = element;
    });
    this.output["Details"] = details;
    this.output["PersonalInfo"] = this.input.PersonalInfo[0];
    console.log(this.output);
  }

Check out the demo

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Unusual Conduct when Interacting with ContentEditable Text

Looking for help with a strange issue that I can't seem to figure out. Hopefully someone has encountered this before and might have a solution. In my Angular app, I'm using a contenteditable <div> for inputting content, which is working fi ...

htmlmysqlangularcontenteditable

Issue with Angular custom toggle functionality not functioning properly on mobile devices

I've been working on creating a custom toggle feature in Angular. While everything runs smoothly on desktop, I'm encountering issues on mobile devices. On desktop, the toggle works by clicking and dragging to the right, whereas on mobile, it shou ...

javascriptangulartypescriptangular2-template

What's preventing me from using just one comparison condition in TypeScript?

The issue at hand is quite simple: An error occurred because I tried to compare a number with a 'Ref<number>' object. It seems ridiculous that I can't compare two numbers, but as I am new to Typescript, I would greatly appreciate some ...

javascripttypescriptvue.jsdomfrontend

Having trouble with Angular Ng2-file-Upload's Upload.all() method not successfully sending files to the API

Dealing with the challenge of uploading files in mp4 and jpg formats, I have set up 2 separate instances of FileUploader with custom validation. Upon clicking the upload button, I attempt to merge the files from both instances into a single FileUploader ...

angulartypescriptangular-file-uploadng2-file-upload

What is the best way to transform a string into a template reference object?

In the process of setting up ngTemplateOutlet within *ngFor, I encountered an issue similar to that outlined in the code snippet below. <ul> <li *ngFor="let item of list"> <ng-container [ngTemplateOutlet]="item.type"></ng- ...

angularangular-template-variable

Empowering Angular2 templates with intelligent code suggestions

Our team has recently embarked on the transition to Angular2 from a different framework. Most of our component templates are not inline and are stored in separate HTML files. Is there a tool or plugin available that can provide something akin to IntelliSe ...

visual-studioangularangular2-template

Is Angular Signals on track to potentially supplant NgRx in some aspects?

After diving into Signals that are set to be introduced in Angular 16, I have already started coding with it and find it pretty amazing! I've heard rumors (and believe them) that Signals will likely replace most of the RxJS code, except for asynchron ...

angularngrxstate-managementangular-signals

Ways to prevent altering values in ngModel

I am working on a component in Angular 5 where I am trying to write unit tests to ensure that when the component is disabled, it should not be possible to set a value to its model. However, even after disabling it, I am still able to change the value. [ ...

angularunit-testingtypescript

Exploring different pages in an Ionic and AngularJS mobile application

I am brand new to the world of Ionic and AngularJS. I have just started working on a simple project but have hit a roadblock. My goal is, To create a login page and a register page. When a user clicks the register button on the login page, they should be ...

javascriptcssangularjsionic-framework

Incorporate the Get Your Guide Widget into an Angular2 component

Currently, I am attempting to embed a "Get Your Guide" Widget within an Angular2 application. Although the script in index.html is being requested successfully, I am facing difficulties adding it to the HTML of the component. <script async defer src=" ...

angulartypescriptwidgetembed

Tips for retrieving data from Angular Material Table source

It's great to see everyone doing well! I'm facing an issue with rendering data to a material table, and I can't figure out why it's not working. When I try to assign the data to the table's datasource for rendering, the information ...

javascripthtmlangular

Encountering a [object Object] error at the AppComponent_Host ngfactory js file while working on an Angular 8

While attempting to run the official sample angular app provided by Microsoft Identity platform (which utilizes the MSAL library for authenticating Azure AD users), an error is encountered. It seems that there may be a challenge in pinpointing the specific ...

angularazure-ad-msal

The element 'x' is not found within the 'unknown' type

I've been struggling with this issue. After searching through various sources like stackoverflow and github, I attempted a solution which involved adding a generic but I encountered the error message Expected 0 type arguments, but got 1. in relation t ...

reactjstypescripttypesreact-router

What is the best way to attach events to buttons using typescript?

Where should I attach events to buttons, input fields, etc.? I want to keep as much JS/jQuery separate from my view as possible. Currently, this is how I approach it: In my view: @Scripts.Render("~/Scripts/Application/Currency/CurrencyExchangeRateCreate ...

jqueryasp.net-mvctypescript

Secure your NetSuite API calls with OAuth 1.0 signature authorization

After extensively reviewing the documentation and various posts on Stack Overflow about creating a signature for NetSuite OAuth1.0 with TBA, I believe that I have followed all of the necessary steps and correctly generated the key. However, upon making the ...

typescriptoauthnetsuiteaccess-token

There is no 'next' property available

export function handleFiles(){ let files = retrieveFiles(); files.next(); } export function* retrieveFiles(){ for(var i=0;i<10;i++){ yield i; } } while experimenting with generators in T ...

node.jstypescript

"Revolutionize your date and time selection with the dynamically updating columns

I am in need of a time selection feature where users can choose both hours and minutes. Each hour will have its own set of minutes, and the data structure should look like this: [ { hour: 1, minutes: [0, 15, 30], }, { hour: 4, minut ...

angularionic-frameworkionic4ionic5

Error encountered while running "ionic cordova run android" command

Recently, I revisited my Ionic Cordova app after a few months and encountered an unexpected dependency issue when attempting to make a minor adjustment to the app. Although the app previously functioned correctly, even reverting all changes failed to addre ...

androidangularcordovaionic-frameworknpm

Can the TypeScript Event class be customized and extended?

Snippet of Code: class CustomEvent extends Event { constructor(name) { super(name); } } var customEvent = new CustomEvent("scroll"); Error Encountered During Runtime: An error occurred: Uncaught TypeError: Failed to construct 'Ev ...

typescript

Pressing a button that appears multiple times and is also embedded within layers

I am facing an issue where I need to interact with a button that appears multiple times on the website within nested cards. Specifically, I am trying to locate the card containing a pet named Bala, as shown in the attachment below, and click on the Detail ...

typescriptcypress