How do I sort the data in ascending order from a JSON and output it to table?

Question

I work with mat-table and used GET to output my data. Now I would like to sort the data ascending by the db-nr from my JSON.

Extract from my JSON:

{
                    "period": 12.0,
                    "amount": 0.0,
                    "name": "Test1",
                    "mandantKagId": 0.0,
                    "db-nr": 5
                },
                {
                    "period": 12.0,
                    "amount": 0.0,
                    "name": "Test2",
                    "mandantKagId": 0.0,
                    "db-nr": 2
                },
                {
                    "period": 12.0,
                    "amount": 0.0,
                    "name": "Test3",
                    "mandantKagId": 0.0,
                    "db-nr": 4
                }

// TS

// Fill the table with data
  private loadData() {
this.planBwaService.getAllPlanBwaData(yearString).subscribe(
          (resp: any) => {
            const planBwa = resp.success ? resp.bwaResult.planBwa : null;
            const data = planBwa['0'];
            const allYearlyResults = planBwa.yearlyResults;
            const yearlyResults = allYearlyResults['0'];
            if (null !== data && data && yearlyResults && yearlyResults !== null) {
              this.isLoading = false;
              const rows = [];
              const planBwaData: string[] = [];
              const names = _.uniq(data.map((d) => d.name)) as string[];
              for (const n of names) {
                planBwaData[n] = data.filter((d) => d.name === n);
                if (planBwaData[n].length > 0) {
                  const row: any = { name: planBwaData[n][0].name, values: {}, note: '', mandantKagId: planBwaData[n][0].mandantKagId };
                  for (const item of planBwaData[n]) {
                    row[item.period] = this.transformAmount(item.amount);
                  }
                  const yrNameItem = yearlyResults.find((yr) => yr.name === n);
                  row.values.currentYear = (yrNameItem && yrNameItem !== null) ? this.transformAmount(yrNameItem.amount) : null;
                  rows.push(row);
                }
              }
              this.dataSource = new MatTableDataSource<PlanBwa>(rows);
              this.dataSource.data = rows;
            } 
        );
}

Can you please give some guidance on how I can implement this?

Does this answer your question? [Sorting an array of objects by property values](https://stackoverflow.com/questions/979256/sorting-an-array-of-objects-by-property-values) — fen1x, Feb 09 '21 at 09:04
Had already tried in my function. I am told sort is not a function. — , Feb 09 '21 at 09:05
In that case _what you have_ is not an array. Check [this codepen](https://codepen.io/fen1x/pen/eYBzQYN?editors=0012) — fen1x, Feb 09 '21 at 09:13

score 2 · Answer 1 · answered Feb 09 '21 at 09:13

Your json extract seems a little confusing, is it an array of objects? Because then you can sort the data with yourdata.sort((a, b) => a['db-nr'] - b['db-nr'])

For example:

const data = [{
  "period": 12.0,
  "amount": 0.0,
  "name": "Test1",
  "mandantKagId": 0.0,
  "db-nr": 5
}, {
  "period": 12.0,
  "amount": 0.0,
  "name": "Test1",
  "mandantKagId": 0.0,
  "db-nr": 2
}, {
  "period": 12.0,
  "amount": 0.0,
  "name": "Test1",
  "mandantKagId": 0.0,
  "db-nr": 4
}]

data.sort((a, b) => a['db-nr'] - b['db-nr'])

console.log(data)

Edit: To turn your JSON into a JS object you can use JSON.parse

score 0 · Answer 2 · answered Feb 09 '21 at 09:33

0

For descending order:

const items = items.sort(function (a, b) { return b.db-nr - a.db-nr; });
For ascending order:

const items = items.sort(function (a,b) { return a.db-nr - b.db-nr; });

answered Feb 09 '21 at 09:33

Ziregbe Otee

534
3
9

How do I sort the data in ascending order from a JSON and output it to table?

2 Answers2