2

Angular.js 在内部使用createDateInputTypengModel 绑定来处理特定于日期和时间的输入元素。在此createDateParser用于解析日期/时间。例如:
的定义input[date]

'date': createDateInputType('date', DATE_REGEXP,
    createDateParser(DATE_REGEXP, ['yyyy', 'MM', 'dd']),
    'yyyy-MM-dd'),

的定义input[time]

'time': createDateInputType('time', TIME_REGEXP,
    createDateParser(TIME_REGEXP, ['HH', 'mm', 'ss', 'sss']),
   'HH:mm:ss.sss'),

基本上可以更改源中使用的日期和时间格式。但没有指定其他格式的 api/选项。(我认为这很适合 ngModelOptions)

现在我只想使用指令扩展原始行为并添加使用用户指定格式字符串的解析器/格式化程序。为此,我需要类似的功能createDateParser- 那么是否可以在指令中使用这些内部函数?


替代解决方案是将 moment.js 作为解析/格式化库。

我已经设置了一个Plunker来演示这一点 - 使用 moment.js - 但如果功能位于核心中的某个位置,最好不要包含外部库......(该指令仅在浏览器不原生时才会激活支持日期或时间)

我只是在第一个位置添加解析器和格式化程序,array.unshift()因此对于格式化程序,它将被最后调用。对于解析器,它将首先被调用。
格式化程序只是将 angular/iso 格式化的字符串转换回日期对象并根据用户给定的格式对其进行格式化formatString

ctrl.$formatters.unshift(function(value) {
    if (value) {
        var tempDate = moment(value, format_internal);
        var intDateFormatedString = tempDate.format(scope.formatString);
        return intDateFormatedString;
    }
});

解析器仅在另一个方向上工作相同并进行一些验证。

ctrl.$parsers.unshift(function(viewValue) {
    var resultString;
    if (viewValue) {
        // momentjs with strict parsing
        var tempDate = moment(viewValue, scope.formatString, true);
        if ( tempDate.isValid() ) {
            ctrl.$setValidity("userInput", true);
             // return as string with internal angular expected format
            resultString = tempDate.format(format_internal);
        }
    }
    return resultString;
});

仅部分相关:

如何使用 ngModel 在 angularjs 指令中手动重新运行格式化程序链?

希望“问题”的风格还可以——我不确定我是否找到了正确的焦点..最终以某种方式将它分开会更好吗?

4

0 回答 0