javascript AngularJS angular-ui bootstrap timepicker 作为下拉菜单
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20758484/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 19:13:52 来源:igfitidea点击:
AngularJS angular-ui bootstrap timepicker as dropdown
提问by MR.ABC
i like to show the timepicker as a dropdown (popup) in a input element like the datepicker. Is there any easy way to accomplish this or is a complete new directive necessary ?
我喜欢在日期选择器等输入元素中将时间选择器显示为下拉(弹出)。有什么简单的方法可以实现这一点还是需要一个完整的新指令?
回答by Maxim Shoustin
HTML
HTML
<div class="container container-fluid" ng-controller="MainCtrl">
var1={{var1}}
<form class="form-horizontal" novalidate name="form" ng-submit="submit()">
<div class="well">
<div id="date" class="input-append" datetimez ng-model="var1">
<input data-format="hh:mm:ss" type="text" id="input1" name="input1"></input>
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
</span>
</div>
</div>
</form>
</div>
JS
JS
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.var1 = '12-07-2013';
});
app.directive('datetimez', function() {
return {
restrict: 'A',
require : 'ngModel',
link: function(scope, element, attrs, ngModelCtrl) {
element.datetimepicker({
language: 'en',
pickDate: false,
}).on('changeDate', function(e) {
ngModelCtrl.$setViewValue(e.date);
scope.$apply();
});
}
};
});