在角JS Twitter的引导日期选择器 [英] Twitter bootstrap datepicker in Angular js
本文介绍了在角JS Twitter的引导日期选择器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我建立与Twitter的引导,角js和乳脂糖DB的应用程序。
I am building an application with twitter bootstrap,Angular js and Taffy DB.
JavaScript的:
javascript:
$(function() {
$('#datepicker').datepicker();
});
$scope.submit = function () {
console.log($scope.eventdate);
};
HTML
<label for="eventdate">Date</label>
<div class="input-append date" id="datepicker" data-date-format="dd-mm-yyyy">
<input class="span2" size="20" type="text" id="eventdate" ng-model="eventdate">
<span class="add-on"><i class="icon-th"></i></span>
</div>
但的console.log($ scope.eventdate);
未定义
请指教
推荐答案
如果您决定使用角度,把日期选择器
进入指令:
If you decided to use Angular, put datepicker
into directive:
JS
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({
dateFormat:'dd-MM-yyyy',
language: 'en',
pickTime: false,
startDate: '01-11-2013', // set a minimum date
endDate: '01-11-2030' // set a maximum date
}).on('changeDate', function(e) {
ngModelCtrl.$setViewValue(e.date);
scope.$apply();
});
}
};
});
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="MM-dd-yyyy" 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>
<大骨节病> Plunker 骨节病>
这篇关于在角JS Twitter的引导日期选择器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文