[英]javascript - AngularJS - UI Bootstrap Datepicker
Am new to AngularJS. 是AngularJS的新手。 I want to implement datepicker in my project. 我想在我的项目中实现datepicker。 Am using angular.min.js version AngularJS v1.5.0-rc.1 ui-bootstrap-tpls-0.12.0.js version 0.12.0. 我使用的是angular.min.js版本的AngularJS v1.5.0-rc.1 ui-bootstrap-tpls-0.12.0.js版本的0.12.0。 Am getting confused with lot of examples online. 在线上的许多示例让我感到困惑。 How to implement datepicker in angularjs. 如何在angularjs中实现datepicker I used the below code in my application. 我在应用程序中使用了以下代码。
app.directive('datepicker', function() {
return {
restrict: 'A',
require : 'ngModel',
link : function (scope, element, attrs, ngModelCtrl) {
$(function(){
element.datepicker({
dateFormat:'dd/mm/yy',
onSelect:function (date) {
scope.$apply(function () {
ngModelCtrl.$setViewValue(date);
});
}
});
});
}
}
});
and in my HTML page I used like this. 在我的HTML页面中,我是这样使用的。
<input type="text" ng-model="endDate" datepicker>
below is the output am getting 下面是输出越来越
How can I fix this? 我怎样才能解决这个问题? am clueless. 毫无头绪。 Kindly pls help me get through this. 请帮助我解决这个问题。
Thanks in advance. 提前致谢。
Here is the documentation for ui-bootstrap. 这是ui-bootstrap的文档 。
Here is their plunkr demonstrating multiple uses of datepicker, including both inline datepicker and the popup version. 这是他们的plunkr演示了datepicker的多种用法,包括嵌入式datepicker和弹出版本。
HTML for inline datepicker should look something like this 内联日期选择器的HTML应该看起来像这样
<div style="display:inline-block; min-height:290px;">
<uib-datepicker ng-model="dt" class="well well-sm" datepicker-options="inlineOptions"></uib-datepicker>
</div>
Make sure you are correctly loading/referencing ui-bootstrap and angular in your project. 确保在项目中正确加载/引用ui-bootstrap和Angular。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.