javascript - Hvordan man omdanner et Firebase REST API-svar til et array i TypeScript?


Jeg har i øjeblikket et problem med at behandle responsdata, som jeg har sendt til min Firebase Realtime Database ved hjælp af REST i min Angular-app. Bare for at indlede: Jeg vil være ærlig. Jeg lærer langsomt både Angular og Firebase.

Jeg har en børnerute i min database kaldet "pending-orders"

https://i.sstatic.net/ytwEs.png

Hver unik ID der matcher den loggede bruger, som lavede indkøbsordren på det tidspunkt.

For at erhverve alle mine ventende ordrer sender jeg en GET http-anmodning til min database, hvor slutpunktet er pending-orders.json, præcis som Firebase-dokumentationen foreslår.

Dette giver mig et svar, som jeg antog ville være et array. Men i stedet er det et objekt med indlejrede objekter. Jeg loggede svaret, som er:

{G2v12VlKwNPXwtUDV4g41PIqHZx1: {…}, hYgflcf7WGR6wLrCPkAL1B4MbZI3: {…}}

Hvad jeg har brug for, er dog et array, som indeholder børnene (værdierne af nøglerne i det svarobjekt). Jeg er ikke helt sikker på, hvordan man får et. Hvordan går man frem for at opnå dette?

Som en bemærkning...

Faktisk er jeg ikke engang sikker på, hvordan jeg skulle gå frem for at udtrække et børnepunkt, hvis unikke ID er blevet genereret af Firebase selv (gennem en POST-anmodning).

Medmindre jeg har sprunget noget over i dokumentationen for REST-API'er, dækker de, hvordan nyindsatte child-noder får deres eget unikke ID via POST-forespørgsler, men diskuterer senere ikke, hvordan man specifikt får adgang til disse child-noder eller via samlinger (som jeg prøver at gøre). Klienten har ingen måde at kende disse unikke id'er (eller de brugerdefinerede id'er, jeg selv har genereret), så vidt jeg ved.

Svar #1

Da TypeScript bare er JavaScript, kan du gøre ting som:

const pendingOrdersResponse = await firebase.handwaving.pendingOrders();
const pendingOrdersTransformed = Object.keys(pendingOrdersResponse).map(id => {
  return { uuid: id, ...pendingOrdersResponse[id] };
});

Så vil pendingOrdersTransformed være et array med dine data som almindelige JavaScript-objekter i arrayet og den genererede ID som uuid-feltet på hver pendingOrder i arrayet.

Svar #2

Med udgangspunkt i Jay Codist's kommentar har jeg gjort følgende for at opbygge mit eget array af ProcessedOrders baseret på de responsdata, jeg får fra Firebase. Den løsning, jeg kom frem til, er som følger:

fetchPurchaseOrders(): void {
this.http
  .get('https://APP-NAME.firebaseio.com/pending-orders.json')
  .subscribe((res) => {
    if (res) {
      const processedOrders: ProcessedOrder[] = [];
      for (const [key, value] of Object.entries(res)) {
        processedOrders.push(value as ProcessedOrder);
      }
      console.log(processedOrders);
    }
  });

}

Dette giver mig mulighed for at gemme ordrerne uden at bekymre mig om den brugerdefinerede ID, jeg har sat til hver børnenode i databasen. Console.log() der gør det muligt for mig at udskrive alle ordrerne, som jeg ønskede. Dette betyder, at arrayet af ProcessedOrders nu kan bruges i appen, som jeg vil.

Jeg kan ikke lade være med at spekulere på, at jeg måske har rodet min datastruktur til ved ikke at tænke det ordentligt igennem. Denne tilgang vil være fantastisk, hvis jeg kun vil se ordrerne, men ikke så meget, hvis jeg vil opdatere nogen information om dem fra en administrativ side, da jeg stadig vil være nødt til at stole på det brugerdefinerede ID, jeg oprindeligt gav dem.

Jeg kunne også tage mig tid til at lære AngularFire, som andre kommentatorer har foreslået. Måske vil det være bedre og nemmere at finde ud af end REST API.

Under alle omstændigheder. Problemet er blevet løst, da den oprindelige hensigt med mit spørgsmål var, hvordan man gør et svar til et array.

Tak til alle, der prøver at hjælpe!

Relaterede artikler