Angular2如何处理日期管道的值为null答案

【问题标题】：Angular2 how to handle value of date pipe is nullAngular2如何处理日期管道的值为null
【发布时间】：2017-06-25 20:04:53
【问题描述】：

我有像这样使用日期管道的模板

{{value | date: 'dd/MM/yyyy'}}

这个value 是null

如果我的值为 null 我得到字符串 'object not match'，如何处理？

【问题讨论】：

标签： angular angular2-template

【解决方案1】：

{{ (value !== null) ? (value | date: 'dd/MM/yyyy') : "" }}

【讨论】：

我遇到了其他错误Parser Error: Conditional expression (value !== null) ? value | date: 'dd/MM/yyyy' : '-' requires all 3 expressions at the end of the expression [ {{ (value !== null) ? value | date: 'dd/MM/yyyy' : '-'}}@bharat
@Youngzie {{ (value !== null) ? （值|日期：'dd/MM/yyyy'）：“”}}
现在有更简洁的写法。查看@Yurii-Bratchuk 的回答

【解决方案2】：

你可以添加这个：

{{value || '' | date: 'dd/MM/yyyy'}}

这应该像魅力一样！

这是工作的plunker

【讨论】：

还是错误Invalid argument '' for pipe 'DatePipe'@Igor
你使用的是什么版本的角度？

【解决方案3】：

使用 Angular 4.2.4 检查

{{(value | date:'dd/MM/yyyy') || 'n/a' }}

【讨论】：

虽然这不会干扰渲染过程，但它仍然会在日志中乱扔Error: InvalidPipeArgument: 'Unable to convert "NaN" into a date' for pipe 'DatePipe' 消息。

【解决方案4】：

使用 5.2.0

<h4> {{ (value | date : 'mediumDate') ? (value | date : 'mediumDate') : 'Present' }} </h4>

【讨论】：

【解决方案5】：

如果您的数据迟到并在视图中显示无效日期或其他任何内容，请使用此逻辑并第一次设置 null。

@Pipe({
    name: 'displayDate'
})
export class DisplayDatePipe implements PipeTransform {
    transform(value): any {
        if (value !== null) {
            return moment(value).format(DateFormat.DD_MMM_YYYY);
        }
        return null;
    }
}

【讨论】：

【解决方案6】：

使用 Angular 8x 检查

{{ (value !== "null") ? （值|日期：'dd/MM/yyyy'）：“-”}}

【讨论】：

【解决方案7】：

在日期管道中，如果您以“dd/mm/yyyy”格式获取日期为“dd/00/yyyy”（其中 mm 为 null 或 00），则使用“dd/MM/yyyy”（MM 应该大写）而不是“dd/mm/yyyy”

【讨论】：

【解决方案8】：

试试这个简单的方法：

{{(value==null) ? value: value | date: 'dd/MM/yyyy'}}

或者，如果您不想打印 null，那么您可以将任何内容（N/A 或 Null 或 None）放在引号下的以下选项中，或者您也可以保持原样。

{{(value==null) ? "": value | date: 'dd/MM/yyyy'}}

【讨论】：

嗨@Aashu，欢迎！由于这个问题已经有一个公认的答案，因此只有在您可以对现有答案进行实质性改进的情况下，您才应该提交新的答案。您在这里的回答似乎没有这样做。