0

我正在创建一个类似于“Whatsapp”的简单消息列表。我想包括今天，昨天等的小宣传。

JSON格式：

   {
      "id":"2",
      "chat_id":"2",
      "msg":"sample message 1",
      "timestamp":1404803173
   }

HTML：

<ul>
    <li class="time"><span>Today/Yesterday/2DaysAgo</span></li>
    <li ng-repeat="result in results">{{result.msg}}<small>{{result.timestamp*1000 | date:'medium'}}</small></li>
</ul>

我想在一天中只显示第一个<li>( class="time") 一次（不是所有消息）。有没有更好的方法可以做到这一点？

4

3 回答 3

1

恕我直言，最好的方法是按时间对消息进行排序，然后按天拆分它们，并作为输出重复天数和天数的消息，使用其他方法可能真的过于复杂，不值得花时间

于 2014-07-08T08:22:00.207 回答
1

你有服务器端吗？如果是，最好的方法是：

  1. 在每个新的一天首次加载时显示“时间”li。
  2. 加载 li 后，将服务器端的标志设置为“true”
  3. 在每晚 0000 时（或每天早上首次加载时）将标志设置为 false。
  4. 如果该标志已在当天设置为 true，请检查每次加载。

不确定这是否可以纯粹从客户端完成。值得一试的一种方法是每天在 LocalStorage 中设置一次标志（可能附加日期？）并在每次加载时检查此标志..

于 2014-07-08T08:20:03.013 回答
0

考虑到这个 JSON 来自一个服务并且它是一个数组：

var json=[
    {
              "id":"1",
              "chat_id":"2",
              "msg":"sample message 1",
              "timestamp":1404803173
    },
    {
              "id":"2",
              "chat_id":"2",
              "msg":"sample message 2",
              "timestamp":1404803174
    },
...]

然后您可以在控制器上创建一个新对象，循环遍历 JSON 中的项目并为所有日期添加唯一键值，以便您可以过滤它，例如：没有“/”的日期

$scope.json = Service.json;

$scope.dates = [];
$scope.messages = [];
for(i=0; i<$scope.json.length; i++){
    var d = new Date($scope.json[i].timestamp*1000);
    var index = String(d.getDate()) + String((d.getMonth()+1)) + String(d.getFullYear());
    var obj = {id: index, data: $scope.json[i]};
    $scope.messages.push(obj);
    if($scope.dates.indexOf(index) == -1) $scope.dates.push(index);
}

然后，在您看来：

<ul ng-repeat="date in dates">
    <li class="time"><span>{{date | someFilterToGetDayFromDate}}</span></li>
    <li ng-repeat="message in messages | filter:{'id':  date}:true">{{message.msg}}<small>{{message.timestamp*1000 | date:'medium'}}</small></li>
</ul>

我没有测试代码，但希望你能明白在这里做什么。如果不清楚，请告诉我，我将尝试进一步解释。

于 2014-07-08T10:43:24.697 回答