javascript - Angular 日期选择器的行为完全不符合预期

标签 javascript angularjs angular-ui-bootstrap momentjs

我在日期选择器问题上遇到了致命的困惑。

谁能解决我的问题我可以给100分作为返回。

当我点击 2016-08-23 的日历时,它会显示 2016-08-22 作为日期值。

此外, Angular 模型中的日期值也不正确。

我想让输出能够保持一致。

要重现错误问题,请更改洛杉矶和东京之间的时区

inline

演示站点:https://test.jiyubi.com/tour_package/home

inline

Controller js

app.controller('tourPackageStartDatePickerCtrl',
    function ($scope) {

        $scope.initStartDate = function () {
           $scope.startDate = $scope.startDate || null;
        };
        $scope.initStartDate();


        $scope.dateOptions = {
            baseDate: $scope.startDate,
            minDate: $scope.startDate || moment.utc().toDate(),
        };

        $scope.openStartDateClick = function () {
            $scope.startDatePopup.opened = true;
        };


    });

app.controller('tourPackageEndDatePickerCtrl',
    function ($scope, $rootScope) {

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

        $scope.endDateOptions = {
            dateDisabled: disabledDays,
            baseDate: new Date(),
        };

        $scope.openEndDateClick = function () {
            $scope.endDatePopup.opened = true;
        };


        $scope.$watch("endDate", function (new_val, old_val) {
            if (new_val && moment(new_val).isValid()) {
                setTravelDateRange($scope.startDate, $scope.endDate);
            }
        }, true)

        function setTravelDateRange(startDate, endDate) {
            var start_date = moment_with_TAIPEI_TZ(startDate).format("YYYY/MM/DD");
            var end_date = moment_with_TAIPEI_TZ(endDate).format("YYYY/MM/DD");
            moment(startDate.toDateString()).tz("Asia/Taipei").format("YYYY/MM/DD");
            $scope.q_param.startDate = start_date;
            $scope.q_param.date_range = start_date + "-" + end_date;
        }


    });

helper.js

    function moment_with_TAIPEI_TZ(time){
       return moment(time).tz("Asia/Taipei");
    }

    function MOMENT_WITH_LOCAL(time){
       return moment(time).local();
    }

    function discard_timezone(value) {
       return moment.utc(value).format(DEFAULT_MOMENT_TIME_FORMAT);
    }

    function getYYYYMMDD(value) {
       return moment.utc(value).format("YYYY/MM/DD");
    }

    function date_without_timezone(value) {
       return moment.utc(value).toDate();
    }

最佳答案

这可能是因为时区问题。 您能否尝试在不考虑时区的情况下转换为日期?

this.convertToDateWithoutTimezone = function(date) {
    if (date.toString().match(/(\d\d\d\d)-(\d\d)-(\d\d)/)) {
        var year = $filter('date')(date.slice(0, 10), 'yyyy'),
            month = $filter('date')(date.slice(0, 10), 'MM'),
            day = $filter('date')(date.slice(0, 10), 'dd');
        return new Date(year, month - 1, day);
    } else {
        return new Date(date);
    }
};

关于javascript - Angular 日期选择器的行为完全不符合预期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39112790/

相关文章:

javascript - AngularJS 中的 console.log 在范围函数之后执行

javascript - 在 AngularJS 中从数组中获取对象的正确方法

AngularJS 与 node-webkit

javascript - html onclick 和 ng-click 中未定义函数,并且 ui-sref 未触发

javascript - 以 Angular 访问窗口 TemplateUrl 内的范围

javascript - jquery之前检查td中的复选框

javascript - 使用地理定位 API 计算我的速度 javascript

popover - 带有关闭按钮的 Angular UI Bootstrap 弹出窗口

javascript - 如何将一个传单标记添加到多个图层组?

javascript - 如何在新选项卡中打开外部链接