javascript - 如何使用 Angular ng-repeat 对数据进行分组?

标签 javascript angularjs

我显示了一组对象,其中包含有关该对象的信息。我使用 ng-repeat 来显示所有对象,但我现在想实现一个过滤器或函数,按月对对象进行分组,如果我在同一个月注册了对象,则在索引中显示该月的所有对象

这是我的 JSON 数组,其中值“upload_date ”是我想要获取特定月份的位置

"_embedded": {
    "incidents": [
        {
            "id": 20,
            "name": "Nombre de incidente",
            "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
            "timestamp": "2015-03-13T00:00:00-0600",
            "upload_date": "2015-03-31T23:58:19-0600",
            "archived": false,
            "_links": {
                "self": {
                    "href": "http://incidents-core/app_dev.php/incidents/20"
                },
                "attachments": {
                    "href": "http://incidents-core/app_dev.php/incidents/20/attachments"
                },
                "comments": {
                    "href": "http://incidents-core/app_dev.php/incidents/20/comments"
                }
            }

这是我的带有 ng-repeat 的 html 代码,这有效

<ul class="list" >
               <h1>January</h1><br />**<---- HERE I WOULD LIKE THO SHOW THE MONTH**
               <br />
                <li class="list__item" ng-repeat="incident in incidents">
                    <!-- ngrepeat: mostrar total de incidentes-->
                    <a href="#" data-toggle="modal" data-target="#incidentModal" ng-click="selectIncident($index)">
                        <!-- /.badgetSection-->
                        <figure class="list__item__inner">
                            <div class="bagdets">
                                <span class="glyphicon glyphicon glyphicon-comment"><span> {{incident._embedded.commentsCount}} </span>
                                <span class="glyphicon glyphicon glyphicon-picture"><span> {{incident._embedded.attachmentsCount}} </span>
                            </div>
                            <!-- ./badges -->
                            <div class="incident-image">
                                <img ng-src="{{incident._links.thumbnail.href || 'img/03.jpg'}}">
                                <p class="incident-type"><span>{{incident._embedded.incident_type}}</span>
                                </p>
                            </div>
                            <figcaption>
                                <p>{{incident.name}}</p>
                                <div class="line-separator"></div>
                                <p>{{incident.description | strLimit: 90 }}</p>
                                <div class="line-separator"></div>
                                <p><span class="glyphicon glyphicon-calendar"></span> {{incident.timestamp | date:'EEE - dd/mm/yyyy'}} <span class="glyphicon glyphicon-time"></span> {{incident.timestamp | date:'hh:mm:ss a'}}</p>
                                <div class="line-separator"></div>
                                <p> <span class="glyphicon glyphicon-user"></span> {{incident._embedded.employee}}</p>
                            </figcaption>
                        </figure>
                    </a>
                </li>
            </ul>

我的想法是尝试显示按月份排序的所有注册对象,如果该月没有对象,则不显示该月份。但我不知道如何按月分组

最佳答案

检查这个 Angular 过滤器,它提供了很多选项 https://github.com/a8m/angular-filter

关于javascript - 如何使用 Angular ng-repeat 对数据进行分组?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30037251/

相关文章:

javascript - Highcharts 区域填充

javascript - 我可以发送多个有关不断变化的操作的事件吗?

javascript - GWT : CSS styles not reflecting in UI

javascript - CropperJS getCroppedCanvas() 在第二次初始化时返回 null

javascript - Angular 办公室织物 ui 表,获取选定的项目

javascript - 使用 RESTful API 通过 Angular、ng-file-upload 异步上传文件

javascript - 可以用 ngCordova 将 Base64 数据保存为文件吗?

javascript - 如何在 Emscripten 生成的代码中使用 C++ 分配的数组?

javascript - 如何通过 Angular js中图像的最小高度设置列表中图像的高度?

javascript - 可以在 AngularJs 中设置 base 标签的 href 属性吗?