angular ui bootstrap datepicker的多种日期格式答案

【问题标题】：Multiple date formats for angular ui bootstrap datepickerangular ui bootstrap datepicker的多种日期格式
【发布时间】：2015-04-20 16:40:54
【问题描述】：

我的应用中有以下 HTML。

<p class="input-group">
    <input ng-model="myDate" datepicker-popup="MM/dd/yyyy" 
           is-open="isopen" />
    <span style="cursor:pointer" ng-click="opendate($event)" class="input-group-addon input-sm"><i class="glyphicon glyphicon-calendar"></i></span>
</p>

我希望在用户以 4.3.2015 或 4.3.15 格式输入日期时填充 ngModel，但目前我将 ngModel 设置为未定义。我怎样才能告诉日期选择器也接受其他日期格式？

请检查这个 plunkr http://plnkr.co/edit/t1f9AkHeKzvyPTQNzvxf?p=preview，这在 Chrome 中有效，但在 IE 中无效。您可以在 chrome 中输入 4.4.15 并且它可以工作，在 IE 中同样不起作用

【问题讨论】：

docs 上的示例显示了如何使用多种格式以及可以编辑的 plnkr。你试过M.d.yyyy或d.M.yyyy的格式吗？
日期4.3.15 应该是“2015 年 4 月 3 日”还是“2015 年 3 月 4 日”或“2004 年 3 月 15 日”还是...？
4 月 3 日。当我删除行 datepicker-popup="MM/dd/yyyy" 时，弹出窗口没有打开。
datepicker-popup 是 datepicker 指令的名称，因此如果没有它，它将不会尝试查找 ng-model。与我们分享您的代码，以便其他人可以复制问题，从而更好地了解您正在尝试做什么以及哪里出了问题。
请检查这个 plunkr plnkr.co/edit/t1f9AkHeKzvyPTQNzvxf?p=preview，这在 Chrome 中有效，但在 IE 中无效。您可以在 chrome 中输入 4.4.15 并且它可以工作，在 IE 中同样不起作用

标签： angularjs datepicker angular-ui angular-ui-bootstrap

【解决方案1】：

如果我理解正确，您想让用户决定他们如何输入日期格式？

据我所知，日期格式需要事先定义，并且在用户填写时无法“检测到”。但是，您可以在控制器中创建一个具有可接受日期格式的数组：

// Accepted date formats.
$scope.formats = ['MM/dd/yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];

// Default date format.
$scope.format = $scope.formats[0];

在您的 HTML 输入字段中将 datepicker-popup 属性更改为 datepicker-popup="{{format}}"。

用户可以在视图中有一个下拉（HTML 选择）菜单，他们可以在其中选择他们喜欢的日期格式，这将更改 $scope.format 的值。日期选择器会相应改变。

【讨论】：

当我删除 datepicker-popup="MM/dd/yyyy" 行时，弹出窗口没有打开。但如果该行不存在，则 ngModel 未设置为未定义。我在 ngModel 中获取值。这就是它假设的工作方式吗？
请检查这个 plunkr plnkr.co/edit/t1f9AkHeKzvyPTQNzvxf?p=preview，这在 Chrome 中有效，但在 IE 中无效。您可以在 chrome 中输入 4.4.15 并且它可以工作，在 IE 中也不起作用。
日期格式仅适用于默认格式。例如如果您从接受的日期格式手动输入，则它不起作用

【解决方案2】：

我使用 DateParser 上的 alt-input-formats 来提供替代格式

alt-input-formats (Default: []) - A list of alternate formats acceptable for manual entry.

【讨论】：