Angular UI引导程序日期选择器

Angular UI bootstrap datepicker

本文关键字:选择器 日期 引导程序 UI Angular      更新时间:2023-09-26

我使用的是Angular UI引导程序的日期选择器,当我以编程方式更改日期时,视图不会更改,当我在11月30日,并以编程方式将日期更改为12月2日时,日期会更改,但视图仍固定在11月,下面是我如何编写下一个日期按钮的代码。

$scope.right=function(){
    if($scope.viewmodel.timeResolution=='yearly')
        $scope.dt.setFullYear($scope.dt.getFullYear()+1);
    else if($scope.viewmodel.timeResolution=='monthly')
        $scope.dt.setMonth($scope.dt.getMonth()+1);
    else if($scope.viewmodel.timeResolution=='daily') {
        $scope.dt.setDate($scope.dt.getDate() + 1);
    }
    $scope.changedValue();
};

Html:

 <uib-datepicker ng-model="dt" id="dp" datepicker-mode="mode" init-date="initDate" show-weeks=false max-mode="maxMode"  min-date="minDate" max-date="maxDate" min-mode="minMode" class="well well-sm"  ng-change="changedValue(viewmodel.dt)"></uib-datepicker>

每次在日期选择器上以编程方式更改日期时,如何模拟刷新视图?

您需要再次转换为日期。函数集。。。只返回时间戳:

$scope.right=function(){
    if($scope.viewmodel.timeResolution=='yearly')
        $scope.dt = new Date($scope.dt.setFullYear($scope.dt.getFullYear()+1));
    else if($scope.viewmodel.timeResolution=='monthly')
        $scope.dt = new Date($scope.dt.setMonth($scope.dt.getMonth()+1));
    else if($scope.viewmodel.timeResolution=='daily') {
        $scope.dt = new Date($scope.dt.setDate($scope.dt.getDate() + 1));
    }
    $scope.changedValue();
};

为了让你对有角度的日期有更好的整体体验,你应该研究moment.js

http://momentjs.com/

它允许您轻松创建、格式化、添加和减少日期,而且问题很少。使用默认的date.set函数可能会导致很多问题。

我有一个这样的设置,使用没有问题的时刻