使用 angularjs 时意外重置 Bootstrap 日期选择器

Question

我正在尝试将 Bootstrap Datepicker from eternicode 与 angularjs 结合使用。

var app=angular.module('myApp', [])
.controller('dateCtrl', function($scope) {
    // Case 1:
    $scope.datepick = '';
    // Case 2:
    //$scope.datepick = '25.04.1986';

    $scope.setFirstDate = function() {
        $scope.datepick= '13.10.1960';
    };

    $scope.setAnotherDate = function() {
        $scope.datepick = '20.02.1967';
    };

});

$(document).ready(function(){
    $('.datepicker').datepicker({
        autoclose: true,
        format: 'dd.mm.yyyy',
        clearBtn: true,
        todayBtn: 'linked',
        todayHighlight: true,
        weekStart: '1',
        calendarWeeks: true,
        keyboardNavigation: false
    });
});

基本上，它工作正常。但是当我以编程方式更改日期时，BS Datepicker 会忽略它。这表明，当您最初加载 fiddle 并按照以下步骤操作时：

1) 点击'First me!'

2) Select 输入字段，不触及日期选择器

3) Tab out，按 Esc 键，或单击除日期选择器以外的任何地方（关闭它而不选择日期）

您会看到，输入字段现在是空的。

这不会发生，因为 this question 中建议的日期格式无效：取消注释 fiddle 和测试用例 2 中的第 6 行。重复上述步骤。日期字段现在显示“25.04.1986”。

此外，在这两种情况下，您都可以尝试点击日期选择器，然后重复步骤 1-3。输入字段将显示 BS Datepicker 选择的最后一个日期。

{{datepick}}

表明 ng-model 总是准确的，所以这个问题不是 this or this 问题的重复。 看到 angularjs 总是知道实际日期，我不明白 scope.apply 如何解决我的问题。

这告诉我：BS Datepicker 正在跟踪他自己的日期并且只会记住初始日期或日期选择器本身选择的日期。当关闭而不选择新的时，它会将输入字段重置为这个记住的值。

那么我该如何防止这种情况发生呢？

Answer 1

因此，我找到了解决此问题的方法。要防止日期选择器重置输入值，请添加：

forceParse: false

到您的日期选择器选项。参见 updated jsfiddle。

尽管这解决了手头的问题，但请记住，日期选择器将不再 parse/check/correct 任何输入。

我认为这是一个错误，会在 Github 上引起问题。

使用 angularjs 时意外重置 Bootstrap 日期选择器

Unintended Reset of Bootstrap Datepicker when using angularjs

datepicker

twitter-bootstrap

angularjs