Как использовать Группирование по трубе с ключом группировки определенного формата даты

Question

У меня есть список данных:

  players  = [{name: 'Gene', team: 'team alpha', date: '2019-09-18T16:45:42' },
              {name: 'Steve', team: 'team gamma', date: '2019-09-18T15:45:42'},
              {name: 'George', team: 'team beta', date: '2019-20-18T12:45:42'},
              {name: 'Paula', team: 'team beta', date: '2019-18-18T15:45:42'},
              {name: 'Jhon', team: 'team gamma', date: '2019-09-18T15:45:42'}];

}

Я хотел бы использовать группирующий канал, который находится только на дате, но вместо формата '2019-09-18T15: 45: 42 ', это должно быть сделано только в следующем формате' 2019-09-18 ', который более соответствует группе.

здесь используется труба:

  @Pipe({name: 'groupBy'})
   export class GroupByPipe implements PipeTransform {
    transform(collection: Array<any>, property: string): Array<any> {
     if(!collection) {
        return null;
     }

    const groupedCollection = collection.reduce((previous, current)=> {
        if(!previous[current[property]]) {
            previous[current[property]] = [current];
        } else {
            previous[current[property]].push(current);
        }

        return previous;
    }, {});

    return Object.keys(groupedCollection).map(key => ({ key, value: groupedCollection[key] }));
  }
}

и html:

 <ul>
   <div *ngFor="let player of players | groupBy:'date'"> Team : {{player.key}}
     <li *ngFor="let eachplayer of player.value">
  {{eachplayer.name}}
    </li>
   </div>
</ul>

https://stackblitz.com/edit/angular-h2ve9k?file=src/app/app.component.html

Я думаю, что такая обработка даты была бы удобной, но я не знаю, где я могла бы ее использовать

   date.split('T')[0];

Я слушаю ваши предложения по решению

Answer 1

Вы можете преобразовать дату своей коллекции перед группировкой:

  @Pipe({name: 'groupBy'})
   export class GroupByPipe implements PipeTransform {
    transform(collection: Array<any>, property: string): Array<any> {
     if(!collection) {
        return null;
     }

    const mappedCollection = collection.map(player => ({
                               ...player, 
                               date: player.date.split('T')[0]
                             }));

    const groupedCollection = mappedCollection.reduce((previous, current)=> {
        if(!previous[current[property]]) {
            previous[current[property]] = [current];
        } else {
            previous[current[property]].push(current);
        }

        return previous;
    }, {});

    return Object.keys(groupedCollection).map(key => ({ key, value: groupedCollection[key] }));
  }
}