Angular mat-table: multiple rows per record with sorting option

I want to create a table when each records has two table rows. I achived this by splitting the data to separate rows. The problem is sorting – I want to sort records, not a table rows. Funny thing is that it’s almost works as expected in my stackblitz example, the only problem is when DESC is set as sorting order.

ASC:

enter image description here

DESC:

enter image description here

As you can see for desc order the record should have switch its places.

Here is an example that I prepared: https://stackblitz.com/edit/material2-rc0-6rzgwh?file=app/app.component.ts

In my application when I have to use it I have my custom sortingDataAccessor because some of <td> are not just strings but more complex elements:

this.dataSource.sortingDataAccessor = (item, property) => {
      if (item[property]) {
        return this.parseValue(item[property]);
      } else {
        for (const column of this.columns) {
          if (column.fieldPath && column.id === property) {
            return this.parseValue(getNestedValue(item, column.fieldPath));
          }
        }
      }
    };

So in my case each of table rows are included to sort so "the descriptions" rows are next to each other, and then the other rows are next to each other. Can someone help me with that?

20 thoughts on “Angular mat-table: multiple rows per record with sorting option”

  1. I’ve been exploring for a little for any high-quality articles or blog posts
    on this sort of space . Exploring in Yahoo I eventually stumbled upon this web site.

    Studying this information So i’m satisfied to exhibit that
    I have a very good uncanny feeling I found out exactly
    what I needed. I such a lot indubitably will make sure to don’t overlook this site
    and give it a glance regularly.

    Feel free to surf to my web site: LeafMax CBD

    Reply
  2. Simply wish to say your article is as amazing.

    The clearness in your post is simply cool and i can assume you’re an expert on this subject.
    Fine with your permission let me to grab your RSS feed to keep
    updated with forthcoming post. Thanks a million and please keep up the
    rewarding work.

    Also visit my site :: Slot Lionking888

    Reply
  3. Hello! This is my first visit to your blog! We are a collection of volunteers and
    starting a new initiative in a community in the
    same niche. Your blog provided us beneficial information to work on. You have done a extraordinary job!

    Look at my page; game 3win8

    Reply
  4. Hmm it looks like your blog ate my first comment (it was extremely long) so I guess I’ll just sum it up what I had written and say, I’m thoroughly enjoying
    your blog. I too am an aspiring blog writer but I’m still new to the whole thing.
    Do you have any tips for newbie blog writers? I’d really appreciate it.

    My web page … epicwin test id

    Reply
  5. It’s the best time to make some plans for the future
    and it is time to be happy. I’ve learn this publish and if I may just I want
    to suggest you few interesting issues or tips.

    Maybe you can write next articles regarding this article.
    I desire to read even more things approximately it!

    Also visit my page; Jamaal

    Reply
  6. I don’t know whether it’s just me or if perhaps everyone else encountering problems with your
    website. It seems like some of the written text
    in your posts are running off the screen. Can somebody else please
    comment and let me know if this is happening to them too?
    This could be a problem with my internet browser because I’ve had
    this happen previously. Cheers

    Feel free to surf to my blog post … Lashay

    Reply

Leave a Comment