在Angular-UI-Bootstrap Datepicker中,在设置日期(date = today)上显示自定义字符串(“Today”)?

时间:2015-04-27 15:15:40

标签: javascript angularjs datepicker angular-ui-bootstrap

我正在实施Angular-UI datepicker作为指令,并且我试图将其显示为今天的字符串'Today'而不是2015/04/27。

这可能吗?我可以轻松地将$scope.dt更改为"Today",但如果我想将其保存到我的数据库,我需要将其转换回来,这很麻烦。它看起来像一个自定义格式....但我从这里的代码中看不到如何做到这一点?

1 个答案:

答案 0 :(得分:1)

您可以编写一个过滤器,用于包装AngularJS提供的原始date过滤器并接受自定义格式,如果格式为默认值或传递日期不是今天,则将格式转发为date。 这是一幅草图:

.filter('my_date', ['dateFilter', function (dateFilter) {
    function filter(date, format, timezone) {
        var today  = new Date();
        if (!(date instanceof Date)) {
            date = new Date(date);
        }

        if (format == "today") {
            if (date.getFullYear() == today.getFullYear() && date.getMonth() == today.getMonth() && date.getDate() == date.getDate()) {
                return "Today";
            } else {
                format = "yyyy/mm/dd"; // this is default
            }
        }

        return dateFilter(date, format, timezone);
    }
    return filter;
}])

使用:

{{dt | my_date:'today'}}

这里有一个改进的空间:您可以查看更多专用程序,以便将AngularJS源中传递给过滤器的任何内容转换为日期(特别是它接受JSON);默认格式可以参数化。

。如果您已准备好自己使用日期输入输入,那么概述的技术将起作用 - 即,您可以选择要使用的过滤器。它不适用于AngularUI中的即用型datepicker-popup - 它使用内置的date过滤器,除了修改AngularUI的源代码之外似乎无法覆盖它。如果弹出窗口是你需要的,你必须自己添加“弹出逻辑”