在AngularJS中加载当前Week的数据

Question

I want to retrieve current week dates and days name(Like: Monday, Tuesday) in AngularJS. Week should start from Monday. Like the picture below:

And clicking on next week button, next week's dates and days name will be loaded in frontend.

Note : Week's data should be loaded from internet. It should not load the system's date.

I tried to google, didn't got this kind of solutions.

Thanks in Advance.

Answer 1

Using moment.js , you can do the following to get the current week and the next one :

controller.js

function TodoCtrl($scope) {
var currentDate = moment();

 var fnWeekDays = function(dt) {

    var currentDate = dt;
    var weekStart = currentDate.clone().startOf('week');
    var weekEnd = currentDate.clone().endOf('week');

    var days = [];
    for (i = 1; i <= 7; i++) {

        days.push(moment(weekStart).add(i, 'days').format("D (ddd)"));

    };
    return days;
}

$scope.weekDays = fnWeekDays(currentDate);
$scope.nextWeek = function(dt) {
    $scope.weekDays = fnWeekDays(moment(dt, "D (ddd)").add(1, 'days'));
};
$scope.previousWeek = function(dt) {
    $scope.weekDays = fnWeekDays(moment(dt, "D (ddd)").subtract(1, 'days'));
};


}

html

<div ng-app>
<div ng-controller="TodoCtrl">
<a ng-click="previousWeek(weekDays[0])">Previous</a>
<a ng-click="nextWeek(weekDays[6])">Next</a>
<div ng-repeat="day in weekDays">
  {{day}}
</div>

Here is a Fiddle