Angular 1.6- ng重复订单和组件项目

Question

所以我要实现的是：

• 循环通过一系列消息(ng-repeat(
• 按日期对消息进行排序
• 然后，如果作者匹配(存储在同一DIV元素中(
• 如果当前消息的作者不匹配上一个
，则创建新的div
• 继续循环

我被困在这里：

<div class="message" ng-repeat="msg in chatDetails.msgList">
  <p>{{ msg.text }}</p>
</div>

我需要保留确切的订单 - 简而言之，如果以前的元素不与当前匹配 - 应创建新框。

这甚至可以在角度吗？如果是这样，你能告诉我如何吗？

谢谢！

编辑

HERES样本chatDetails的结果：

  {
    msgList: [
      { author: 0, text: 'hi', date: 1493050181799 },
      { author: 1, text: 'hola!', date: 1493050181801 },
      { author: 1, text: 'wilkomen', date: 1493050181802 },
      { author: 0, text: 'czesc', date: 1493050181803 }
      { author: 0, text: 'ciao', date: 1493050181804 }
      { author: 1, text: 'bonjour', date: 1493050181805 }
    ]
  }

某种程度上所需的结果：

<div class="message-list">
  <div class="message-group" data-author="1">
    <div class="message">
      <p>hola</p>
    </div>
    <div class="message">
      <p>ciao</p>
    </div>
  </div>
  <div class="message-group" data-author="0">
    <div class="message">
      <p>hola</p>
    </div>
  </div>
  <div class="message-group" data-author="1">
    <div class="message">
      <p>hola</p>
    </div>
    <div class="message">
      <p>hola</p>
    </div>
  </div>
</div>

Answer 1

我相信您的问题可以用" orderby"解决。

https://docs.angularjs.org/api/ng/filter/orderby

看起来像：

<div class="message" ng-repeat="msg in chatDetails.msgList | orderBy: 'date'">
    <p>{{ msg.text }}</p>
</div>

如果您的MSG对象具有一定的日期或索引值，则可以按该数字进行排序。