twitter-bootstrap AngularJS 1.3 - Datepicker 初始格式不正确
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25742445/
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
AngularJS 1.3 - Datepicker initial format is incorrect
提问by camden_kid
I started using AngularJS 1.3 yesterday and one problem I have found is that the initial date in the Datepicker is not in the defined format. The format of the date is correct afterchoosing a date.
我昨天开始使用 AngularJS 1.3，我发现的一个问题是 Datepicker 中的初始日期不是定义的格式。选择日期后日期格式正确。
The initial format is correct with AngularJS 1.2.10 as can be seen in the example by commenting out the script tag.
AngularJS 1.2.10 的初始格式是正确的，如示例中通过注释掉脚本标记所见。
How can I set the initial format to be correct?
如何将初始格式设置为正确？
HTML
HTML
<!doctype html>
<html ng-app="plunker">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.0/angular.min.js"></script>
<!-- <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.js"></script> -->
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<br>
<br>
<div ng-controller="DatepickerDemoCtrl">
<div class="row">
<div class="col-md-6">
<p class="input-group">
<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
</div>
</div>
</body>
</html>
JS
JS
var app = angular.module('plunker', ['ui.bootstrap']);
app.controller("DatepickerDemoCtrl", function ($scope) {
$scope.format = 'dd-MMMM-yyyy';
$scope.today = function() {
$scope.dt = new Date();
};
$scope.today();
$scope.open = function($event) {
$event.preventDefault();
$event.stopPropagation();
$scope.opened = true;
};
});
回答by Dave Johnson
Not sure exactly what changed in 1.3, but there is a bug report for this.
不确定 1.3 中到底发生了什么变化，但有一个关于这个的错误报告。
Here's a drop-in directive for the initial value that fixes the problem until the bug is fixed. And here is a demo Plunker.
这是初始值的插入指令，用于修复问题，直到修复错误。这是一个演示Plunker。
angular.module('myApp').directive('datepickerPopup', function (dateFilter, datepickerPopupConfig) {
return {
restrict: 'A',
priority: 1,
require: 'ngModel',
link: function(scope, element, attr, ngModel) {
var dateFormat = attr.datepickerPopup || datepickerPopupConfig.datepickerPopup;
ngModel.$formatters.push(function (value) {
return dateFilter(value, dateFormat);
});
}
};
});
回答by Kalhan.Toress
app.controller("DatepickerDemoCtrl", function ($scope,$filter) { .. // $filter added
$scope.today = function() {
$scope.dt = $filter('date')(new Date(), $scope.format);
};
<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" ... // {{format}} added
Please check with these three modifications.
请检查这三个修改。
