我尝试了moment.js并尝试使用jquery daypicker。但到目前为止还没有真正的工作。我想当我尝试使用这些方法时，我错过了一些东西，或者我错了。
正如您在下面看到的我的代码，我可以显示月份的最后一个＆＃39;一个只有基本的香草javascript。但是我想让这个更好。 我差不多一个星期就在这里工作了。我认为现在是时候寻求帮助......
在我的js文件中：
'use strict';
require('./create-data-table.scss');
const angular = require('angular');
// const moment = require('moment');
const sampleApp = angular.module('sampleApp');
sampleApp.component('createDataTable',{
template: require('./create-data-table.html'),
controller: 'CreateTableController',
controllerAs:'createTableCtrl'
});
sampleApp.factory('listsFactory', function($q,$http){
return {
getLists: function(){
return $http.get('https://gist.githubusercontent.com/evanjacobs/c150c0375030dc4de65e9b95784dc894/raw/35c5f455b147703db3989df0cb90f5781c3b312f/usage_data.json');
}
};
});
sampleApp.controller('CreateTableController', ['$scope', '$http','listsFactory', CreateTableController]);
function CreateTableController($scope,$http, listsFactory){
// $scope.date ={ year:null, month:null};
listsFactory.getLists().then(function(response){
$scope.lists = response.data;
console.log($scope.lists);
}, function(error){
console.error(error);
});
$scope.reverse = function() {
$scope.lists.reverse();
};
$scope.sortingByMonthFilter = function(year, month) {
console.log('filtering');
$scope.unfilteredLists = $scope.unfilteredLists || $scope.lists;
$scope.lists = $scope.unfilteredLists.filter((record) => {
return record.date.includes(`${year}-${month}`);
});
};
$scope.getLastWeek = function() {
$scope.unfilteredLists = $scope.lists;
$scope.lists = $scope.lists.filter((record) => {
var today = new Date();
var currentYear = today.getFullYear();
var currentMonth = today.getMonth();
var currentDay = today.getDate();
var recordDate = new Date(record.date);
var recordYear = recordDate.getFullYear();
var recordMonth = recordDate.getMonth();
var recordDay = recordDate.getDate();
var lastWeekDays = [];
var firstDayOfLastWeek = currentDay -7;
for(var i = currentDay; i >= firstDayOfLastWeek; i--){
lastWeekDays.push(i);
}
var lastWD1 = lastWeekDays[0];
var lastWD2 = lastWeekDays[1];
var lastWD3 = lastWeekDays[2];
var lastWD4 = lastWeekDays[3];
var lastWD5 = lastWeekDays[4];
var lastWD6 = lastWeekDays[5];
var lastWD7 = lastWeekDays[6];
if (recordYear === currentYear && recordMonth === currentMonth){
console.log(recordYear,recordMonth, currentYear,currentMonth);
// if(recordDay.matches(lastWeekDays)){
// return record;
// }
if (recordDay=== lastWD1|| lastWD2||lastWD3||
lastWD4||lastWD5|| lastWD6||lastWD7){
console.log(record);
return record;
}
}
else {
console.log('No matching data!');
}
});
};
$scope.getLastMonth = function(){
$scope.unfilteredLists = $scope.lists;
$scope.lists = $scope.lists.filter((record) => {
var today = new Date();
var currentMonth = today.getMonth();
var currentYear = today.getFullYear();
var recordDate = new Date(record.date);
var recordYear = recordDate.getFullYear();
var recordMonth = recordDate.getMonth();
var lastMonth = currentMonth -1;
if (recordYear === currentYear){
if (recordMonth === lastMonth && lastMonth !== 0 ){
console.log(record);
return record;
}
if(recordMonth === lastMonth && lastMonth === 0 ){
recordYear = currentYear -1;
recordMonth = 11;
return record;
}
}
});
};
$scope.byTwoDates = function(){
$scope.unfilteredLists = $scope.lists;
$scope.lists = $scope.lists.filter((record) => {
// function daysBetween(startDate, endDate){
// var days = [], current = startDate;
// while(current <= endDate){
// days.push(current);
// }
// return days;
// }
var startD = document.getElementById('startDate').value;
var endD = document.getElementById('endDate').value;
console.log(startD,endD);
var currentDate = new Date(startD);
var d =[];
console.log(d);
});
};
$scope.sortType = 'name';
$scope.sortReverse = false;
$scope.searchData = '';
}
在我的HTML中
<div class ="create-data-table">
<table>
<thead>
<section class="bylastMonth">
<button name="filter" ng-click="getLastMonth()">Last Month Data</button>
</section>
<section class="bylastWeek">
<button name="filter" ng-click="getLastWeek()">Last Week Data</button>
</section>
<section class="bytwoDays">
<!-- <input id="startDate"/>
<input id="endDate"/> -->
<label>Start Date</label><input id="startDate" type="date">
<label>End Date</label><input id="endDate" type="date">
<button name="filter" ng-click="byTwoDates()">Between Two days</button>
</section>
<tr>
<td>
<a href="#" ng-click="sortType = 'date'; sortReverse = !sortReverse">
Date
<span ng-show="sortType == 'date' && !sortReverse" class="fa fa-caret-down"></span>
<span ng-show="sortType == 'date' && sortReverse" class="fa fa-caret-up"></span>
</a>
<section class="filteringByMonth">
<input name="year" type="text" placeholder ="Year" ng-model="date.year" >
<input name="month" type="text" placeholder="Month(MM)" ng-model="date.month" >
<button name="filter" ng-click="sortingByMonthFilter(date.year, date.month)">Filter</button>
</section>
</td>
<td>
<a href="#" ng-click="sortType = 'users'; sortReverse = !sortReverse">
Users
<span ng-show="sortType == 'users' && !sortReverse" class="fa fa-caret-down"></span>
<span ng-show="sortType == 'users' && sortReverse" class="fa fa-caret-up"></span>
</a>
<form>
<div class="form-group">
<div class="input-group">
<div class="input-group-addon">
<i class="fa fa-search"></i>
</div>
<input type="text"
name ="users"
class="form-control" placeholder="search by Users #" ng-model="searchData">
</div>
</div>
</form>
</td>
<td>
<a href="#" ng-click="sortType = 'searches'; sortReverse = !sortReverse">
Searches
<span ng-show="sortType == 'searches' && !sortReverse" class="fa fa-caret-down"></span>
<span ng-show="sortType == 'searches' && sortReverse" class="fa fa-caret-up"></span>
</a>
</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="list in lists | orderBy:sortType:sortReverse |
filter:searchData">
<td>{{ list.date }}</td>
<td>{{ list.users }}</td>
<td>{{ list.searches }}</td>
</tr>
</tbody>
</table>
拯救我！
答案 0 :(得分：0)
我假设您使用的是http://angular-ui.github.io/bootstrap/和https://github.com/urish/angular-moment，因此您需要更改byTwoDates功能并使其像
$scope.byTwoDates = function(start, end) {
try {
return ((moment.duration(end - start)).humanize());
} catch (e) {
return "It's not valid to evaluate"
}
};
如果你想获得LastWeek，你可以使用以下方法：
本周：
moment().startOf('isoWeek')
moment().endOf('isoWeek')
上周
moment().subtract(1, 'weeks').startOf('isoWeek')
moment().subtract(1, 'weeks').endOf('isoWeek')
请参阅此文档：http://momentjs.com/docs/
作为例子
/*getLastWeekStart().format('DD/MM/YYYY') to get 10/09/2016 */
function getNextWeekStart() { // Just for demonestration if you want to work with next week you can leave this function.
var today = moment();
//edited part
var daystoMonday = 0 - (today.isoWeekday() - 1) + 7;
var nextMonday = today.subtract('days', daystoMonday);
return nextMonday;
}
function getLastWeekStart() {
var today = moment();
var daystoLastMonday = 0 - (1 - today.isoWeekday()) + 7;
var lastMonday = today.subtract('days', daystoLastMonday);
return lastMonday;
}
function getLastWeekEnd() {
var lastMonday = getLastWeekStart();
var lastSunday = lastMonday.add('days', 6);
return lastSunday;
}
//remember you may also use this
moment('anydate you want ').weekday(-7).format('DD/MM/YYYY')
请随意添加您想要的任何内容并自定义它。