Question

我对Angular很新，我遇到了一个问题。我希望有一种简单的方法来解决这个问题。

基本上，我有一个从服务器检索的约会列表。

$scope.appointments = [{starts_at: "2015-1-1", name: "First"}, {starts_at: "2015-1-1", name: "Last"}, {starts_at: "2015-1-2", name: "Next Day"}];

现在我想在列表中显示这些约会。我决定可以使用ng-repeat +过滤器，但现在我被卡住了。

<ion-slide-box on-slide-changed="slideHasChanged($index)">
  <ion-slide>
    <div class='box'>
      <div class="list list-inset" ng-repeat="appt in appointments | filter:????>
        <div class="item" ng-click="openAppointmentModal(appt)">
          <span>Appt {{appt.name}}</span>
          <span>Starts at {{appt.starts_at}}</span>
        </div>
      </div>
    </div>
  </ion-slide>
</ion-slide-box>

我不确定是否可以使用内置filterFilter来执行此操作，因此我最终编写了自己的过滤器filterDateFilter，其中包含数组，属性名称和您要过滤的日期。然后，我可以编写类似ng-repeat='appt in appointments | filterDate:starts_at:curDate'的内容，其中curDate由$scope.curDate = new Date()在控制器中定义。

呼。这样做，但仅用于过滤任何$ scope.curDate被定义为。

现在，我希望用户能够滑动到上一天/下一天，并仅显示当天的约会。我假设我必须将<ion-slide>移动到模板，但我不确定从那里开始。 我接下来的步骤是什么？

对于很长的帖子和详细解释感到抱歉，但我不想提出问题并且没有先前的努力。

Answer 1

我认为您可以使用离子on-slide-left和on-slide-right指令代替离子滑动来调用您在控制器中定义的函数，该函数将$scope.curDate递增或递减1。这似乎比模拟无限幻灯片更简单。

http://ionicframework.com/docs/api/directive/onSwipeLeft/

在AngularJS中使用模板和过滤

1 个答案: