使用moment.js和angularfire的.startAt(thisWeek）和.endAt(nextWeek）的

What is the most efficient logic to .startAt(thisWeek) and .endAt(nextWeek) using moment.js and angularfire?

本文关键字：moment endAt nextWeek thisWeek js 使用 startAt angularfire      更新时间：2023-09-26

"高效"是一种很好的表达方式，我无法找到一个好的方法来做到这一点！

我很难弄清楚如何设置本周并在新的Firebase记录中引用它，然后在本周的上下文中转到上一周和下一周。

var ref = new Firebase('https://plnkr.firebaseio.com/tasks').startAt(start).endAt(end);

这是我正在使用的参考资料。startAt（）基于当前周的开始，endAt（。但我无法在开始和结束后的7天内设置新的引用来添加或删除。

希望这至少有点道理。

以下是迄今为止带有代码的plnkr：http://plnkr.co/edit/A8lDKbNvhcSzbWVrysVm?p=preview

我需要以某种方式修改现有的ref吗？如果我做了一个新的ref，它会正确地传递到作用域吗？

任何帮助都将不胜感激。

angular.module('app').controller('MainCtrl', function($firebase, $scope) {

  var populateTasks = function(start, end){
    var ref = new Firebase('https://plnkr.firebaseio.com/tasks').startAt(start).endAt(end);
    var list = $firebase(ref).$asArray();
    $scope.list = list;
  }; 
  //initialize week
  var today = moment();
  var startThisWeek = today.startOf('week').valueOf();
  var endThisWeek = today.startOf('week').add(7, 'd').valueOf(); 
  var thisWeek = today.startOf('week');
  populateTasks(startThisWeek, endThisWeek);
  $scope.currentWeek = startThisWeek;
  var weekInMilli = moment.duration(1, 'weeks').valueOf();
  //set next week
  $scope.nextWeek = function(){
    $scope.currentWeek += weekInMilli;
    var startNextWeek = thisWeek.add(7, 'd').valueOf();
    var endNextWeek = thisWeek.add(14, 'd').valueOf();
    populateTasks(startNextWeek, endNextWeek);
  };
  //set previous week
  $scope.prevWeek = function(){
    $scope.currentWeek -= weekInMilli;
    var startLastWeek = thisWeek.subtract(7, 'd').valueOf();
    var endLastWeek = thisWeek.subtract(14, 'd').valueOf();
    populateTasks(startLastWeek, endLastWeek);
  };
  var last = null;
  $scope.priorityChanged = function(priority) {
    var current = moment(priority).startOf('day');
    var changed = last === null || !last.isSame(current);
    last = current;
    return changed;
  };
  $scope.getDayName = function($priority) {
    return moment($priority).format('dddd');
  };
  $scope.addTask = function(newTask) {
    $scope.list.$add({
      title: newTask.title,
      $priority: Firebase.ServerValue.TIMESTAMP
    });
  };
});
//view
<body ng-controller="MainCtrl">
    The current week is {{currentWeek | date}}<br/>
    <button ng-click="prevWeek()">previous week</button>
    <button ng-click="nextWeek()">next week</button>
    <form ng-submit="addTask(task); task.title=null">
      <input placeholder="Add Task" ng-model="task.title"/>
    </form>
    <li ng-repeat="item in list" ng-init="changed = priorityChanged(item.$priority)">
     <h3 ng-show="changed">{{getDayName(item.$priority)}}</h3>
     {{item.title}}  
    </li>

这里有一个plunkr，展示了一种方法：http://plnkr.co/edit/A8lDKbNvhcSzbWVrysVm

通常，我会根据当前周的开始和结束日期来初始化本周。然后我将这些值添加到$scope中。当我需要向前或向后移动一周时，我会在这些值上添加一周的时间，然后将它们传递回populateTasks函数。

 //access a range in the array based on the week. My list is sorted by $priority timestamps. 
 var populateTasks = function(start, end) {
    $scope.start = start;
    $scope.end = end;
    var ref = new Firebase('https://plnkr.firebaseio.com/tasks').startAt(start).endAt(end);
    var list = $firebase(ref).$asArray();
    $scope.list = list;
  };
  //initialize the first week
  var setThisWeekStart = moment().startOf('week');
  var setThisWeekEnd = moment().startOf('week').add(7, 'days');
  $scope.startThisWeek = setThisWeekStart.valueOf();
  $scope.endThisWeek = setThisWeekEnd.valueOf();
  //get the tasks for the first week
  populateTasks($scope.startThisWeek, $scope.endThisWeek);
  //a week in milliseconds
  var weekInMilli = moment.duration(1, 'weeks').valueOf();
  //set next week
  $scope.nextWeek = function() {
    $scope.startThisWeek += weekInMilli;
    $scope.endThisWeek += weekInMilli;
    populateTasks($scope.startThisWeek, $scope.endThisWeek);
  };
  //set previous week
  $scope.prevWeek = function() {
    $scope.startThisWeek -= weekInMilli;
    $scope.endThisWeek -= weekInMilli;
    populateTasks($scope.startThisWeek, $scope.endThisWeek);
  };

我希望这能帮助到别人！感谢@Kato的帮助。他提出了最初的解决方案，使我获得了成功。没有他是做不到的。

相关文章：