如何使用AngularJS在今天的日期和時間9.00am-9.00pm前禁用？

Question

我有兩個字段，一個是日期，另一個是時間。在這里，用戶可以選擇從今天的日期到一個月期間的日期（如何避免選擇一個月或今天之前的日期）。第二個字段的時間選擇器我需要驗證，只有用戶可以選擇上午9:00至下午9:00。

  <div class="row"> <div class="col"> <label class="item item-input item-stacked-label"> <span class="input-label">Date</span> <input type="date" ng-model="bookdate" name="bookdate" > </label> </div> <div class="col"> <label class="item item-input item-stacked-label"> <span class="input-label" >Time</span> <input type="time" ng-model="booktime" name="booktime"> </label> </div> </div> 

Answer 1

Angular的輸入時間指令支持以24小時格式設置最小值和最大值。

<input type="time" 
       ng-model="booktime" 
       name="booktime"
       min="09:00:00"
       max="21:00:00">

https://docs.angularjs.org/api/ng/input/input%5Btime%5D

Answer 2

請檢查以下詳細信息，並提供有關input[date]和input[time] 。

對於日期： 輸入[日期] ：

詳細參數：min（可選）字符串-如果輸入的值小於min，則設置min驗證錯誤鍵。 這必須是有效的ISO日期字符串（yyyy-MM-dd）。

視圖：

<label class="item item-input item-stacked-label">
    <span class="input-label">Date</span>
    <input type="date"  ng-model="bookdate" name="bookdate" max="{{bookdate | bookdate:'yyyy-MM-dd'}}" max="{today}">
  </label> 

到目前為止，修改您的控制器：

var today=new Date();
$scope.today = today.toISOString();

對於時間： input [time] ：

視圖：

<label class="item item-input item-stacked-label">
    <span class="input-label" >Time</span>
    <input type="time" ng-model="booktime" name="booktime" min="09:00:00" max="21:00:00">
  </label>

希望這對您有幫助。