SharePoint Online - SPFx - How to use GroupBy in PnPjs

Question

I am new to SPFx PnPjs. I want to use GroupBy in query but not seeing intellisense in visual code. Here is my query :

var query = pnp.sp.web.lists.getByTitle("Employee").items.select("ID,Title").filter(filterstring).get();

Output i want something like :

var query = pnp.sp.web.lists.getByTitle("Employee").items.GroupBy("Title").select("ID,Title").filter(filterstring).get();

Any suggestion how can I use "GroupBy" in above query ?

score 1 · Accepted Answer · answered Mar 13 '21 at 08:25

There are no way to user GroupBy in pnp js, because it not exists.

But, you can grouping data after you get it in javascript.

For example, you have some interface to store result data, somthing like this:

interface IData{
  Id: number;
  Title: string;
}

interface IGroups{
    Title: string;
    Ids: number[];
}

And after you get request response, you create array of objects

let result: IData[] = [];

query.then((items)=>{
    items.map((item)=>{
      result.push({Id: item.ID, Title: item.Title});
    });
});

After this you get not grouped data, which you can group by filtering:

let groups: IGroups[] = [];
result.map((item)=>{
   //get only titles for grouping
   return item.title;
}).filter((value, index, self)=>{
    //get unique values
    return self.indexOf(value)===index
}).map((item)=>{
    //Here you get distinct title - you groups
    //and creating groups
    groups.push({
        Title: item,
        Ids: result.filter((r)=>{return r.title === item})
    });
});

score 0 · Answer 2 · answered Mar 15 '21 at 08:18

SharePoint Rest API does not support the GroupBy, you could get all supported OData query operations here.

PNP js is an encapsulation of Sharepoint Rest API, so it does not support group by so far.

As a workaround, you can filter out the desired item in the return value.Array.prototype.filter()

SharePoint Online - SPFx - How to use GroupBy in PnPjs

2 Answers2