Question

在我的应用程序中，我有一个下拉预约精神科医生。在这里，用户将输入作为分钟，与医生交谈，因此在下拉菜单中应该看起来像正常时间，如上午9-10点，晚上10点到晚上11点，所以直到下午5点，所以客户可以看到可用的时间到预约。我努力让这个时间分裂。我只完成了从分钟到几小时的转换，之后我对时间分裂感到震惊。希望能在这里获得一些帮助，或任何有效的指导，以便让时间分开。

控制器：

myApp.controller('ctrl', function ($scope) {
       $scope.calc = function () {
         var time = $scope.timeSelect;
                if (time < 60) {
               var a = (time) + 'm';
                } else if (time % 60 == 0) {
                    var a =  (time - time % 60) / 60 + 'h';
                } else {
                    var a = ((time - time % 60) / 60 + 'h' + ' ' + time % 60 + 'm');
                }
                $scope.result =a;
            }        
            $scope.result='';
});

Answer 1

每当您处理日期和时间时，我强烈建议您使用Momentj.js。这是一个非常人为的例子，用于演示如何使用Moment.js设置时间段。

angular.module("app", ["angularMoment"])
  .controller("ctrl", function($scope, moment) {
    var startingTime = moment().hours(9).minutes(0);
    var endingTime = moment().hours(17).minutes(0);
    $scope.selectedTimeslot = "";
    $scope.intervals = [15, 30, 45, 60, 90, 120];
    $scope.interval = 60;
    $scope.timeslots = [];

    $scope.setTimeSlots = function() {
      $scope.timeslots = [];
      var currentStartTime = angular.copy(startingTime); // use copy to avoid reference issues since we're dealing with objects and not primitives
      while (currentStartTime < endingTime) {
        $scope.timeslots.push(currentStartTime.format("h:mm") + " - " + currentStartTime.add($scope.interval, "minute").format("h:mm"));
      }
    }

    $scope.setTimeSlots();

  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.16.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-moment/1.0.0/angular-moment.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  Interval in minutes: <select ng-model="interval" ng-change="setTimeSlots()" ng-options="i for i in intervals"></select>
  <br/>Timeslots:
  <select ng-model="selectedTimeslot" ng-options="slot for slot in timeslots">
    <option value="">Please select</option>
  </select><br/><br/>
  Selected timeslot: {{selectedTimeslot}}
</div>

Answer 2

这可能对您有用：

function createTimeSlots(startHour, endHour, interval) {
    if (!startHour) {
        endHour = 8;
    }
    if (!endHour) {
        endHour = 20;
    }
    var timeSlots = [],
        dateTime = new Date(),
        timeStr = '';
    dateTime.setHours(startHour, 0, 0, 0);
    while (new Date(dateTime.getTime() + interval * 60000).getHours() < endHour) {
        timeStr = dateTime.getHours() + ':' + dateTime.getMinutes();
        timeStr += '-';
        dateTime = new Date(dateTime.getTime() + interval * 60000);
        timeStr += dateTime.getHours() + ':' + dateTime.getMinutes();
        timeSlots.push(timeStr);
    }
    return timeSlots;
}

console.log(createTimeSlots(9, 18, 45));

“9：0-9：45”， “9：45-10：30”， “10：30-11：15”， “11：15-12：0”， “12：0-12：45”， “12：45-13：30”， “13：30-14：15”， “14：15-15：0”， “15：0-15：45”， “15：45-16：30”， “16：30-17：15”

您可能想在getHours（）和getMinutes（）上添加一些0填充，以便1：0将打印为01:00。

Answer 3

从这个问题我可以大致了解你需要什么，所以我希望这能帮到你。首先，我会创建一个单独的函数来将时间（从午夜的分钟数，作为一个简单的例子）转换为字符串，如下所示：

function timeToString(time) {
    if (time < 12 * 60) 
        return (time - time % 60) / 60 + ":" + time % 60 + "am";
    else return (time - time % 60 - 12*60) / 60 + ":" + time % 60 + "pm";
}

然后可以像这样创建用于填充下拉列表的数组：

var times = [];
for (t = startHour * 60; t < endHour * 60; t += duration) {
    times[times.length] = timeToString(t) + ' - ' + timeToString(t + duration);
}

将用户给定分钟的开始时间和结束时间之间的时间分割为输入

3 个答案: