Рендеринг блока сообщений в чате

102

15 сентября 2021, 17:30

Использую Angular, и через async pipe вывожу сообщения в контейнер чата. Нужно реализовать группировку сообщений по дням (как на картинке). Подскажите пожалуйста, как это реализовать ?

Answer 1

Решил таким вот образом.

messages.reduce((prev, curr, index, arr) => {
      let prevObj = index - 1;
      if (curr.formatedDate == arr[prevObj].formatedDate) {} else {
        arr[prevObj].groupDate = arr[prevObj].formatedDate
      }
      return arr;

Передаю массив в фукцию, где у каждого обьекта сравниваю время. Если время отличается, то предыдущему обьекту добавляю поле с предыдущим временем. И это поле рендерю в чате. НА выходе из функцию получаю свой же массив, но уже с нужными мне изменениями. И такая функцию отлично работает и с пагинацией и с подключением webSocket'ов.