时间选择器:如何通过更改第一个值来更改第二个值

Timepicker: how to change second value by change on first?

本文关键字:选择器 第二个 第一个 何通过 时间      更新时间:2023-09-26

我正在用PHP、Bootstrap和Angular JS开发一个议程应用程序
请参阅Plunker实时预览:http://plnkr.co/edit/FSXB9IvGWOMgFzuEASEl?p=preview

现在,如果我想将"开始时间"更改为一个额外的小时,我希望"结束时间"也更改为+1小时。(因此,在更改开始时间时,间隔总是最小为1小时。)当然,在更改"结束时间"时,间隔是否大于1小时并不重要。

我想要这样的东西:

$scope.updateTimeEnd = function() {
	  $scope.TimeEnd.setHours($scope.TimeStart.getHours() + 1);
	};
<div class="row">
  <div class="col-xs-6">
    <div class="selectStartTime">
      <timepicker ng-model="TimeStart" hour-step="hstep" minute-step="mstep" show-meridian="ismeridian"></timepicker>
    </div>
  </div>
  <div class="col-xs-6">
    <div class="selectEndTime">
      <timepicker ng-model="TimeEnd" hour-step="hstep" minute-step="mstep" show-meridian="ismeridian"></timepicker>
    </div>
  </div>
</div>

<timepicker>元素包含在这个js文件中:<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.js"></script>

有人能告诉我如何做到这一点吗?

我不介意是使用angular(例如ng-bind)还是Javascript。

$scope.updateTimeEnd = function() {
    var d = new Date();
    d.setHours($scope.TimeStart.getHours() +1);
    //d.setMinutes($scope.TimeStart.getMinutes());
    $scope.TimeEnd = d;
};
$scope.$watch('TimeStart', function() {
    $scope.updateTimeEnd();
});