Kaip konvertuoti JSON duomenis į „Excel“ skaičiuoklę naudojant kampinį

Kaip kūrėjas esate atviras kasdieniams iššūkiams įvairiuose projektuose, su kuriais galbūt dirbate. Žiniatinklio programos kartais turi atlikti keletą papildomų užduočių, kad pasiektų skirtingus tikslus, priklausomai nuo verslo ar techninių reikalavimų.

Gali reikėti rinkti duomenis iš API ir apdoroti juos kitu formatu, pvz., PDF, XML, DOCX arba XLSX.

Šiame vadove sužinosite, kaip paversti JSON duomenis, gautus iš API atsako, į gerai sutvarkytą „Excel“ skaičiuoklę jūsų „Angular“ programoje.

Kas yra XLSX biblioteka?

„Xlsx“ biblioteka yra veiksmingas šaltinis „Angular“ kūrėjams, norintiems JSON duomenis iš API atsako paversti tvarkinga „Excel“ skaičiuokle. Naudodami šį modulį kūrėjai gali greitai atsisiųsti ir modifikuoti JSON duomenis.

Naudodami Xlsx biblioteką galite kurti ataskaitas savo komandai arba pateikti duomenis naujais būdais. Jei norite greito ir paprasto būdo valdyti duomenis „JavaScript“ programose, tai yra geras pasirinkimas.

Kaip sukonfigūruoti XLSX biblioteką naudojant kampinę programą

Prieš pradedant naudoti Xlsx biblioteką savo Angular programoje, svarbu, kad jūsų kompiuteryje būtų nustatyta Node.js ir Angular kūrimo aplinka. Įdiegus Node.js, Angular lengva nustatyti paleidžiant npm install -g @angular/cli terminale.

Vykdydami sukurkite naują kampinį projektą ng naujas [jūsų kampinis-programos pavadinimas] terminale. Tada eikite į projekto katalogą, kaip parodyta toliau:

Taip pat galite paleisti vietinį plėtros serverį paleisdami ng tarnauti --o, kuri leidžia peržiūrėti savo Angular programą ir jos pakeitimus tiesiogiai naršyklėje.

Nustačius Angular programą, Xlsx bibliotekos įdiegimas yra paprastas procesas, kurį galite atlikti tiesiog paleisdami npm įdiegti xlsx --save. Ši komanda įdiegs priklausomybes, reikalingas Xlsx bibliotekai naudoti.

Kaip konvertuoti JSON duomenis į XLSX formatą kampu

Naudodami Angular CLI galite sugeneruoti naują paslaugą paleisdami ng generuoti paslaugą [paslaugos pavadinimas] komanda terminale. Pavyzdžiui, šiuo atveju galite sugeneruoti jums reikalingą „Excel“ paslaugą naudodami generuoti paslaugą „ExcelService“..

Tai generuoti komanda sukurs paslaugos failą: ExcelService.service.ts, viduje src/app projekto katalogas. Failas pagal numatytuosius nustatymus atrodo taip:

importuoti { Injekcinis } iš„@kampinis/šerdis“; 
@Injekcinis({ pateikta: "šaknis" }) 
eksportuotiklasė„ExcelServiceService“.{
konstruktorius() { } 
}

Tai „ExcelService“. failas atliks duomenų eksportavimo į Excel formatą funkciją. Atnaujinkite ExcelService.service.ts failą, kad jis atrodytų kaip toliau pateiktas kodas:

importuoti { Injekcinis } iš„@kampinis/šerdis“; 
importuoti * kaip XLSX iš'xlsx'; 
konst EXCEL_EXTENSION = „.xlsx“; // Excel failo plėtinys
@Injekcinis({ pateikta: "šaknis" }) 
eksportuotiklasė„ExcelServiceService“.{ 
konstruktorius () { }
viešaseksportuoti į Excel(elementas: bet kuris, failo pavadinimas: eilutė): tuštuma{
// sugeneruokite darbaknygę ir pridėkite darbalapį
konst ws: XLSX.WorkSheet = XLSX.utils.json_to_sheet (elementas);
konst darbaknygė: XLSX.WorkBook = XLSX.utils.book_new(); 
// išsaugoti faile
 XLSX.utils.book_append_sheet (darbo knyga, ws, „1 lapas“);
 XLSX.writeFile (darbo knyga, ${fileName}${EXCEL_EXTENSION}); 
 }
}

Pirmiau pateiktame kode importuojate Xlsx biblioteką ir sukurti pastovų kintamąjį, EXCEL_EXTENSION išsaugoti Excel failo plėtinį.

The eksportuoti į Excel metodas priima du parametrus: elementas ir failo pavadinimas. Elemento parametras nurodo duomenis, kuriuos reikia eksportuoti į „Excel“ failą, o failo pavadinimas parametras yra Excel failo pavadinimas.

Norėdami eksportuoti duomenis į „Excel“ failą, sukurkite darbalapį naudodami json_to_sheet Xlsx bibliotekos metodas. Taip pat sukurkite darbaknygę naudodami biblioteką knyga_nauja metodas.

Tada pridėkite darbalapį į darbaknygę naudodami knygos_pridėjimo_lapas metodą ir išsaugokite faile naudodami rašyti failą.

Anksčiau sukūrėte „Excel“ paslaugą, kad palengvintumėte JSON duomenų atsisiuntimo ir konvertavimo į „Excel“ lapą procesą. Norėdami naudotis šia paslauga, turite sukurti atitinkamą kampinį komponentą ir importuoti į jį paslaugos failą.

importuoti { ExcelService } iš„./excel.service“;

Tada turite įpurkšti jį į komponento konstruktorių taip:

konstruktorius(privatus „ExcelService“: „ExcelService“) { 
... 
}

Tada galite pradėti įgyvendinti funkciją (eksportuoti Excel), kur naudosite eksportuoti į Excel metodas eksportuoti JSON į „Excel“. Žemiau pateiktas kodas parodo, kaip tai padaryti.

eksportuotiExcel(): tuštuma { 
konst fileToExport = tai.apiJsonResponseData.map((daiktai: bet kokie) => { 
grąžinti {
"Vartotojo ID": elementai?.userId,
"ID": prekės?.id,
"Pavadinimas": prekės?.title,
"Kūnas": daiktai?.kūnas
 } 
 });
tai.excelService.exportToExcel(
 failą eksportuoti,
„jūsų Excel failas-“ + naujasData().getTime() + „.xlsx“
 );
}

Aukščiau pateiktame kode apibrėžėte eksportuoti Excel būdas paskambinti eksportuoti į Excel metodas „ExcelService“.. Naujas kintamasis, failą eksportuoti, saugo duomenis, kuriuos reikia eksportuoti. The apiJsonResponseData masyve yra JSON duomenys, gauti iš API atsako.

Vėliau, eksportuoti į Excel metodas excelService paima failą Eksportuoti ir jūsų pageidaujama failo pavadinimas. Atkreipkite dėmesį, kaip prie failo pavadinimo galite pridėti esamą laiko žymą, kad įsitikintumėte, jog jis yra unikalus. Šis metodas konvertuos JSON duomenis ir eksportuos juos į XLSX failą, kurį galėsite peržiūrėti programoje „Excel“.

Šią funkciją dabar galima naudoti bet kurioje jūsų Angular programos dalyje ir galite lengvai pridėti ją kaip įvykių tvarkyklę spustelėkite įvykį arba naudokite jį kitu tinkamu būdu pagal jūsų poreikius.

Šios funkcijos naudojimo pavyzdį galite pamatyti toliau pateiktame paveikslėlyje. JSON duomenys iš išorinės API pateikiami puslapyje, naudojant mygtuką Eksportuokite duomenis į „Excel“.:

Kai paspausite Eksportuokite duomenis į „Excel“. mygtuką, jūsų naršyklė atsisiųs Excel failą. Kada tu atidarykite XLSX failą, išvesties skaičiuoklės failas atrodo taip:

Xlsx biblioteka gali padaryti daug daugiau nei konvertuoti JSON į Excel formatą. Ji siūlo tvirtą biblioteką ir palaiko įvairius failų formatus, su kuriais galite susidurti versle. Patikrinkite Xlsx bibliotekos dokumentacija npm norėdami sužinoti daugiau apie tai.

Duomenų konvertavimas iš JSON į „Excel“ skaičiuokles kampiniu režimu

Naudodami Xlsx biblioteką galite lengvai valdyti „Excel“ skaičiuokles savo žiniatinklio programoje. Čia atlikti veiksmai leidžia paversti JSON duomenis iš API į gerai sutvarkytą „Excel“ skaičiuoklę. Taip pat galite konvertuoti „Excel“ duomenis atgal į JSON naudodami kitas bibliotekos funkcijas.

Geras būdas naudotis šia biblioteka yra sukurti programą, kuri generuoja savaitės arba mėnesio ataskaitas iš API ir tvarko jas kaip „Excel“ duomenis.