I want to make something like this:

"ABCDEF", "GHIJK", "LMNO", "PRSTU", "VYZXWQ", "0123456789"

I have a sequence in alphabetical order; Names with first letters "ABCDEF" must occur in one array and another array with "GHIJK"

I don't know how I can do it.

My returning data:

    [
    {
        "publishDate": "02.08.2022",
        "jobs": [
            {
                "mediaName": "GERCEKTARAF.COM",
                "ids": [
                    {
                        "id": "62ebea1fasfascbd755d317d1ffc9c",
                        "isLocked": false
                    }
                ]
            },
            {
                "mediaName": "MEDYAGAZETE.COM",
                "ids": [
                    {
                        "id": "62ec1asdddc0e45625ab485f38a5",
                        "isLocked": false
                    }
                ]
            },
            {
                "mediaName": "FINANS.GAZETEVATAN.COM",
                "ids": [
                    {
                        "id": "62ecasdasd1dbfe45625ab485f382c",
                        "isLocked": false
                    },
                    {
                        "id": "62ec1dasdasdfc0e45625ab485f3897",
                        "isLocked": false
                    }
                ]
            }
        ]
    }
  ]

(I need to sort my MediaNames in my order, don't confuse with PublishDate, they are for that day only. The important thing is the mediaNames under the job array.)

Here is my code;

ts side:

   getJobsForInternet() {

        this.sidenavService.getInternetJobs().subscribe((jobs: any) => {

            jobs.forEach(getInternetJobs => {

                getInternetJobs.jobs.sort((a, b) => {

                    let _a = a.mediaName
                    let _b = b.mediaName

                    return _a.toString().localeCompare(_b, 'tr', { sensitivity: 'base' });

                })

            });
            this.getJobs = jobs

            console.log(this.getJobs)
        

        });
    }

HTML side:

<nav >
    <details *ngFor="let internetJobs of getJobs " >
        <summary >{{ internetJobs.publishDate }}</summary>
        <details >

             ------ I wrote this part by hand for now, but it should be dynamic ------
            <summary >Internet_ABCDEF</summary>
             ------ I wrote this part by hand for now, but it should be dynamic ------

            <details >
                <summary >
                    (1) {{internetJobs.jobs.length }}
                </summary>
            </details>

        </details>
    </details>
</nav>

CodePudding user response：

// groups
const groups = ["ABCDEF", "GHIJK", "LMNO", "PRSTU", "VYZXWQ", "0123456789"]

// initial data
const data = Array.from({ length: 100 }).map(() => Array.from({ length: Math.random() * 10 | 0   1 }).map(() => String.fromCharCode(Math.random() * 26   65)).join(''))

const grouped = data.reduce((acc, current) => {
  // find to which group the string belongs
  const group = groups.find(g => g.includes(current[0]))
  acc[group].push(current)
  return acc
}, Object.fromEntries(groups.map(g => ([g, []]))))

console.log(grouped)