Javascript AngularJS根据日期检索JSON记录

到目前为止，我只使用了

ng repeat

来检索AngularJS中的结果，但是这次我只剩下了稍微复杂一点的HTML结构

以下是我的HTML示例：

<section ng-controller="LandingController as vm">
  <div class="container-fluid">
    <div class="row" id="blog-headliner">
      <div class="col-md-6 col-sm-12 blog-headline-item">
        ///// JSON object with the earliest update date and has a featured value of 1
      </div>
      <div class="col-md-3 col-sm-4 blog-headline-item" ng-mouseenter="blogHeadlinePClass1 = 'blog-headline-p-reveal'" ng-mouseleave="blogHeadlinePClass1 = ''">
        ///// JSON object with the 2nd earliest update date and has a featured value of 1
      </div>
      <div class="col-md-3 col-sm-4 blog-headline-item" ng-mouseenter="blogHeadlinePClass2 = 'blog-headline-p-reveal'" ng-mouseleave="blogHeadlinePClass2 = ''">
        ///// JSON object with the 3rd earliest update date and has a featured value of 1
      </div>
      <div class="col-md-3 col-sm-4 blog-headline-item" ng-mouseenter="blogHeadlinePClass3 = 'blog-headline-p-reveal'" ng-mouseleave="blogHeadlinePClass3 = ''">
        ///// JSON object with the 4th earliest update date and has a featured value of 1
      </div>
    </div>
  </div>
</section>

注意：在api url中有比这更多的记录，我只是想展示一个示例

所以我想实现的是。。。我想把4条记录拉到前端，其中一个对象的

特征值
为
1
，并根据
更新的时间显示它们，最接近今天日期的4条应该显示出来。如果您查看HTML结构，您将看到
blog headline item
类的元素有一条注释，其中包含每个元素的要求

由于我无法使用ng repeat，我不确定我还能如何做到这一点，任何想法都将不胜感激。
我非常喜欢使用它来处理我的数据收集。因此，使用它，我会：

工作示例：

但是你可以使用$filter服务，或者一个简单的foreach

HTML:

<div data-ng-app="app">

  <section ng-controller="MainController as mainVm">
  <div class="container-fluid">
    <div class="row" id="blog-headliner">
      <div class="col-md-6 col-sm-12 blog-headline-item">
        ///// JSON object with the earliest update date and has a featured value of 1
        {{mainVm.filterData[0]}}
      </div>
      <div class="col-md-3 col-sm-4 blog-headline-item" ng-mouseenter="blogHeadlinePClass1 = 'blog-headline-p-reveal'" ng-mouseleave="blogHeadlinePClass1 = ''">
        ///// JSON object with the 2nd earliest update date and has a featured value of 1
        {{mainVm.filterData[1]}}
      </div>
      <div class="col-md-3 col-sm-4 blog-headline-item" ng-mouseenter="blogHeadlinePClass2 = 'blog-headline-p-reveal'" ng-mouseleave="blogHeadlinePClass2 = ''">
        ///// JSON object with the 3rd earliest update date and has a featured value of 1
        {{mainVm.filterData[2]}}
      </div>
      <div class="col-md-3 col-sm-4 blog-headline-item" ng-mouseenter="blogHeadlinePClass3 = 'blog-headline-p-reveal'" ng-mouseleave="blogHeadlinePClass3 = ''">
        ///// JSON object with the 4th earliest update date and has a featured value of 1
        {{mainVm.filterData[3]}}
      </div>
    </div>
  </div>
</section>

</div>

angular.module('app', []);

angular.module('app')
    .controller('MainController', mainController);

mainController.$inject = ['$scope'];

function mainController($scope){

    var vm = this;

    vm.data = [ ... ];

    vm.filterData = _.chain(vm.data)
                    .orderBy('updated_at', ['desc'])
                    .filter(function(e) { return e.featured == 1})
                    .value();


}

您可以使用来帮助您实现这一目标，例如：

var dates = _([{date: new Date()}, {date: new Date(0)}]).orderBy('date', 'desc').value().splice(0,4)

它将返回按最新且仅4项排序的日期
您可以在控制器中使用
$scope.data=$filter（'orderBy'）（数组，'updated_at'，true）
，然后您可以使用slice仅获取前4项，然后使用ng repeat或仅使用ng model=“data[0]引用数组中的对象。”每个的0-3
var dates = _([{date: new Date()}, {date: new Date(0)}]).orderBy('date', 'desc').value().splice(0,4)