javascript - 第一次加载 Javascript AngularJS 时不显示日期

标签 javascript html angularjs date

我正在制作日历。问题是当我第一次加载时,日期没有显示。如果我转到下个月并再次返回到上个月,那么日期就会显示并且工作正常。假设当前月份是十月,那么当您加载页面时,只会显示当前月份十月。无日期。现在,单击向右箭头转到 11 月,然后单击向左箭头在 10 月再次返回。将显示日期。请检查我的 fiddle 和代码:-

datepicker = angular.module('datepicker', []);

datepicker.controller('dateTimePicker', ['$scope', function($scope){
	console.log('alive');
        
  var date = new Date();
  var months = [],
    monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
      "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"
    ];
  for (var i = 0; i <= 12; i++) {
    months.push(monthNames[date.getMonth()] + ' ' + date.getFullYear());
    date.setMonth(date.getMonth() + 1);
  }
  $scope.year =2015;

  $scope.changeMonth = function(steps) {
    if ($scope.monthIndex + steps >= 0 &&
      $scope.monthIndex + steps <= 12
    ) {
      $scope.dateValues = [];
      $scope.monthIndex = $scope.monthIndex + steps;
      $scope.monthName = $scope.months[$scope.monthIndex];
       var date = new Date();
        console.log(date.getMonth());
        var offset = date.getMonth()
       console.log($scope.monthIndex);
        var offsetDate = offset + $scope.monthIndex;
      $scope.nDays = new Date( $scope.year,  offsetDate+1, 0).getDate();
        console.log(offsetDate+1);
        console.log(new Date( $scope.year, offsetDate, 1));
      for (i = 1; i <= $scope.nDays; i++) {  
    	var d = new Date();
    	$scope.dateValues.push(new Date($scope.year,  offsetDate, i));
  	  }
      
    }else{console.log("missed")}
  };

  $scope.monthIndex = 0;
  $scope.months = months;
  $scope.monthName = months[0];
 

}]);

fiddle 链接:- https://jsfiddle.net/abhijitloco/fxbmpetu/15/

最佳答案

您可以使用 ng-init 来调用您的changeMonth 函数。

<body ng-controller="dateTimePicker" ng-init="changeMonth(0)">

或者您可以在设置月份来设置 $scope.dateValues 变量时在 Controller 中调用它。无论哪种方式,这个变量都需要初始化,因为它不是您当前的代码。

  $scope.monthIndex = 0;
  $scope.months = months;
  $scope.monthName = months[0];
  $scope.changeMonth(0);

工作 fiddle :https://jsfiddle.net/enkode/89sbv65e/

关于javascript - 第一次加载 Javascript AngularJS 时不显示日期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33225469/

相关文章:

javascript - Firefox 中使用 .toLocaleString() 和 moment.js 的日期无效

javascript - 通过 ajax 成功在动态克隆选择选项中填充数据

javascript - Twitter Bootstrap 模式背景不会消失

javascript - 结合 eq、parent 和 index 似乎不起作用

javascript - angular.isArray 函数在循环中不起作用

javascript - 为什么在解析父状态 promise 之前执行子状态解析函数

javascript - JQuery Datatable 仅适用于空(无数据)表

html - Div 文本下推其他 div

html - 有关 Ruby 中 HTTP 拦截代理的帮助吗?

javascript - 我怎样才能在几分钟内进行 Angular 倒计时?