angularjs - Angular-ui datepicker datepicker 的初始状态未按 datepicker-popup 格式化

Question

我正在使用 Angular-ui 日期选择器，除了日期选择器的初始状态外，一切实际上都工作正常。我选择日期后，看起来不错。见下文:

初始状态

在选择器中选择日期后

所以，显然我在第一种情况下得到了日期对象的 strigified 版本，并在选择日期后得到了格式化。

标记

<input type="text" class="form-control"
       id="birthday"
       datepicker-options="datePickerOptions"
       datepicker-popup="{{format}}"
       data-ng-model="birthday"
       data-is-open="opened"
       data-ng-required="true"
       data-close-text="Close"/>

<span class="input-group-btn">
    <button type="button"
            class="btn btn-default"
            data-ng-click="open($event)">
        <i class="fa fa-calendar"></i>
    </button>
</span>

Controller

var today = $scope.today = function today() {
    $scope.birthday = $scope.client.birthday || new Date();
};
today();

$scope.clear = function clear() {
    $scope.dt = null;
};

$scope.open = function($event) {
    $event.preventDefault();
    $event.stopPropagation();

    $scope.opened = true;
};

$scope.format = 'MMM d, yyyy';
$scope.datePickerOptions = {
    'show-weeks': false
};

没什么大不了的，但如果模型(根据文档需要是日期对象)首先按照 $scope.format 进行格式化，而不是按照严格的日期对象。另外，不确定它有什么不同，但这个日期选择器位于模态中。感谢您的帮助!

更新

看来我不是唯一遇到这种情况的人，这与使用 Angular 1.3 有关。 https://github.com/angular-ui/bootstrap/issues/2659

Answer 1

我发现解决方案很冗长，按指令处理等。所以我更喜欢这个简短的解决方案

birthday = $filter('date')(new Date(), "MMM dd, yyyy");

注意:不要忘记将内置的 $filter 服务注入(inject)到 Controller 中

angular.module('app').controller("yourController", 
['$filter' function($filter){ 
       /* your code here */  

       birthday = $filter('date')(new Date(), "MMM dd, yyyy");

       /* your code here */ 
}]);

希望这有帮助。