angularjs 响应式日期选择器
angularjs responsive datepicker
可能这个问题被问了很多次,但我会再问一次。我正在寻找没有 jquery 和 bootstarp 的纯 angularjs 日期选择器 。它应该是响应式的,因为我将在离子框架中用于移动应用程序。
应该设置最大和最小日期,并且可以使用1次以上。
HTML View
<div class="row">
<div class="item-text-wrap item col col-50">
<div class="item-icon-left">
<i class="icon ion-calendar"></i>
<input type="text" class="dateClass" pick-a-date="depDate" pick-a-date-options="depOptions" placeholder="Departure Date" />
</div>
</div>
<div class="item-text-wrap item col col-50">
<div class="item-icon-left">
<i class="icon ion-calendar"></i>
<input type="text" class="dateClass" pick-a-date="arrDate" placeholder="Arrival Date" />
</div>
</div>
</div>
Controller Code
var minDate = new Date();
var maxDate = new Date(minDate.getFullYear() + 1, minDate.getMonth(), minDate.getDate());
$scope.depOptions = {
format: 'dd/mm/yyyy',
min: minDate,
max: maxDate,
onClose: function(e) {
alert($scope.depDate);
}
}
现在,如果您看到我在 onClose
方法中使用了 $scope.depDate
,但我总是未定义。实际上我正在尝试将第二个指令的最小日期设置为第一个指令的选定日期。
这个看起来很有前途,似乎不需要 jquery 或 bootstrap:
我已经创建了一个 ionic-datepicker
凉亭组件。你可以使用它。不需要额外的依赖。
https://github.com/rajeshwarpatlolla/ionic-datepicker
您甚至可以查看 ionic-timepicker
bower 组件。不需要额外的依赖。
https://github.com/rajeshwarpatlolla/ionic-timepicker
可能这个问题被问了很多次,但我会再问一次。我正在寻找没有 jquery 和 bootstarp 的纯 angularjs 日期选择器 。它应该是响应式的,因为我将在离子框架中用于移动应用程序。
应该设置最大和最小日期,并且可以使用1次以上。
HTML View
<div class="row">
<div class="item-text-wrap item col col-50">
<div class="item-icon-left">
<i class="icon ion-calendar"></i>
<input type="text" class="dateClass" pick-a-date="depDate" pick-a-date-options="depOptions" placeholder="Departure Date" />
</div>
</div>
<div class="item-text-wrap item col col-50">
<div class="item-icon-left">
<i class="icon ion-calendar"></i>
<input type="text" class="dateClass" pick-a-date="arrDate" placeholder="Arrival Date" />
</div>
</div>
</div>
Controller Code
var minDate = new Date();
var maxDate = new Date(minDate.getFullYear() + 1, minDate.getMonth(), minDate.getDate());
$scope.depOptions = {
format: 'dd/mm/yyyy',
min: minDate,
max: maxDate,
onClose: function(e) {
alert($scope.depDate);
}
}
现在,如果您看到我在 onClose
方法中使用了 $scope.depDate
,但我总是未定义。实际上我正在尝试将第二个指令的最小日期设置为第一个指令的选定日期。
这个看起来很有前途,似乎不需要 jquery 或 bootstrap:
我已经创建了一个 ionic-datepicker
凉亭组件。你可以使用它。不需要额外的依赖。
https://github.com/rajeshwarpatlolla/ionic-datepicker
您甚至可以查看 ionic-timepicker
bower 组件。不需要额外的依赖。
https://github.com/rajeshwarpatlolla/ionic-timepicker