什么是.startAt（thisWeek）和.endAt（nextWeek）使用moment.js和angularfire最有效的邏輯？
[英]What is the most efficient logic to .startAt(thisWeek) and .endAt(nextWeek) using moment.js and angularfire?
"efficient" is a nice way of saying I can't fathom a good way to do it!
“高效”是一種很好的說法,我無法理解這樣做的好方法!
I'm having a tough time figuring out how to set the current week and reference it in a new Firebase record and then go to the previousWeek and nextWeek in the context of the current week.
我很難搞清楚如何設置當前周並在新的Firebase記錄中引用它,然后在本周的上下文中轉到上一周和下一周。
var ref = new Firebase('https://plnkr.firebaseio.com/tasks').startAt(start).endAt(end);
This is the reference I am using. startAt() is based on the beginning of the current week, endAt() is 7 days after that. But I can't wrap my head around setting up a new reference to add or remove 7 days from start and end.
這是我正在使用的參考。 startAt()基於當前周的開始,endAt()是在此之后的7天。但是,我無法圍繞設置一個新的引用來添加或刪除開始和結束7天。
Hopefully that at least makes some sense.
希望至少有道理。
Here is the plnkr with the code so far: http://plnkr.co/edit/A8lDKbNvhcSzbWVrysVm?p=preview
到目前為止,這是帶有代碼的plnkr:http://plnkr.co/edit/A8lDKbNvhcSzbWVrysVm?p = preview
Do I need to modify the existing ref somehow? If I make a new ref will that be passed along to the scope properly?
我需要以某種方式修改現有的參考嗎?如果我做一個新的參考將被正確地傳遞到范圍?
Any help would be much appreciated.
任何幫助將非常感激。
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>
1 个解决方案
#1
2
Here's a plunkr that shows one way of doing it: http://plnkr.co/edit/A8lDKbNvhcSzbWVrysVm
這是一個顯示一種方法的傻瓜:http://plnkr.co/edit/A8lDKbNvhcSzbWVrysVm
Generally, I initialized the week with a start and end date based on the current week. Then I added those values to $scope. When I needed to go forward or backward a week I would add a weeks worth of time to those values and then pass them back in to the populateTasks function.
通常,我根據當前周來初始化一周的開始和結束日期。然后我將這些值添加到$ 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);
};
I hope that helps somebody! Thanks to @Kato for his help. He came up with the original solution and set me up for success. Couldn't have done it without him.
我希望能幫助別人!感謝@Kato的幫助。他提出了最初的解決方案並讓我獲得成功。沒有他就不可能做到。
注意！
本站翻译的文章，版权归属于本站，未经许可禁止转摘，转摘请注明本文地址：https://www.itdaan.com/blog/2014/09/25/2fcceb637f8fc606b08f9d6595ff4777.html。
