AngularJS如何将1添加到返回日期的函数中
发布时间:2020-12-17 17:11:05 所属栏目:安全 来源:网络整理
导读:我在表格中有一个包含5个单元格的表格,每个单元格对应一周(例如:第01周,第02周等等). 在第一个单元格中,这周给出如下: div class="monthCells"Week {{vm.selectedPeriod}}/div 结果是标题单元格中的文本:“Week 01”. 控制器中显示周数的代码是: return
我在表格中有一个包含5个单元格的表格,每个单元格对应一周(例如:第01周,第02周等等).
在第一个单元格中,这周给出如下: <div class="monthCells">Week {{vm.selectedPeriod}}</div> 结果是标题单元格中的文本:“Week 01”. 控制器中显示周数的代码是: return moment.utc(this.date).format("WW"); 它始终返回所选月份的第一周的数量, 显示其他4周的最佳方式是什么? 我正在考虑一个计数器,所以它增加了我得到的数字: return moment.utc(this.date).format("WW"); 但问题是,这不会在ng-repeat中,但是表头是静态的,所以我想到的一个解决方案是在5个头文件单元格中放置这样的东西: {{vm.selectedPeriod}} {{vm.selectedPeriod +1}} {{vm.selectedPeriod +2}} {{vm.selectedPeriod +3}} {{vm.selectedPeriod +4}} 因此,当用户切换月份时,每周的数字都是正确的但是它不起作用,因为我从我的函数中获取了一个字符串,并且无法弄清楚如何使用momentJS在该函数中解析它. 如果某人有我的想法的解决方案,或者有更好的方法来实现这一点,请告诉我 编辑解决方案 最后我找到了一个只使用momentJS的解决方案. {{vm.date | amDateFormat : 'WW'}} {{vm.date | amAdd : '1' : 'w' | amDateFormat : 'WW'}} {{vm.date | amAdd : '2' : 'w' | amDateFormat : 'WW'}} 解决方法
我会用一个简单而智能的过滤器来完成这个过程,比如我在这个>>中创建的过滤器.
Demo fiddle:
视图 <div ng-controller="MyCtrl"> <div class="monthCells">Week {{currentDate|dateWeekFilter:0}}</div> <div class="monthCells">Week {{currentDate|dateWeekFilter:1}}</div> <div class="monthCells">Week {{currentDate|dateWeekFilter:2}}</div> <div class="monthCells">Week {{currentDate|dateWeekFilter:3}}</div> </div> AngularJS应用程序 var myApp = angular.module('myApp',[]); myApp.controller('MyCtrl',function ($scope) { $scope.currentDate = moment.utc(); }); myApp.filter('dateWeekFilter',function () { return function (date,weeksToAdd) { return moment(date).add(weeksToAdd,'w').format("WW"); } }); 完整的解决方案包括:selectedPeriod范围和datepicker >> Demo fiddle: 视图 <div ng-controller="MyCtrl"> <datepicker> <input ng-model="datePickerDate" ng-change="dateChanged()" type="text"/> </datepicker> <div class="monthCells">Week {{currentDate|dateWeekFilter:selectedPeriod}}</div> <div class="monthCells">Week {{currentDate|dateWeekFilter:selectedPeriod+1}}</div> <div class="monthCells">Week {{currentDate|dateWeekFilter:selectedPeriod+2}}</div> <div class="monthCells">Week {{currentDate|dateWeekFilter:selectedPeriod+3}}</div> </div> AngularJS应用程序 var myApp = angular.module('myApp',['720kb.datepicker']); myApp.controller('MyCtrl',function ($scope) { //Init $scope.currentDate = moment.utc(); $scope.datePickerDate = $scope.currentDate.toDate(); $scope.selectedPeriod = 0; //date change handling $scope.dateChanged = function () { $scope.currentDate = moment.utc($scope.datePickerDate); } }); myApp.filter('dateWeekFilter','w').format("WW"); } }); (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |