ユーザーが入力した分の開始時間と終了時間を分ける時間

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 "、（1）が1：0になるようにgetHours（）およびgetMinutes（）に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); 
}