Angularjs模板默认值,如果绑定Null/Undefined(带过滤器)

Question

我有一个模板绑定,使用Angular的日期过滤器显示一个名为'date'的模型属性,它是一个日期.

<span class="gallery-date">{{gallery.date | date:'mediumDate'}}</span>

到现在为止还挺好.但是,目前,如果日期字段中没有值,则绑定不显示任何内容.但是,如果没有日期,我希望它显示字符串'Various'.

我可以使用二元运算符获得基本逻辑:

<span class="gallery-date">{{gallery.date || 'Various'}}</span>

但是我无法使用日期过滤器:

<span class="gallery-date">{{gallery.date | date:'mediumDate' || "Various"}}</span>

如何在日期过滤器旁边使用二元运算符？

Answer 1

事实证明我需要做的就是将表达式的左侧包裹在软括号中:

<span class="gallery-date">{{(gallery.date | date:'mediumDate') || "Various"}}</span>

Answer 2

我做了以下过滤器:

angular.module('app').filter('ifEmpty', function() {
    return function(input, defaultValue) {
        if (angular.isUndefined(input) || input === null || input === '') {
            return defaultValue;
        }

        return input;
    }
});

要像这样使用:

<span>{{aPrice | currency | ifEmpty:'N/A'}}</span>
<span>{{aNum | number:3 | ifEmpty:0}}</span>

Answer 3

以防你想尝试别的东西.这对我有用:

基于三元运算符,具有以下结构:

condition ? value-if-true : value-if-false

结果:

{{gallery.date?(gallery.date | date:'mediumDate'):"Various" }}

Answer 4

如何在日期过滤器旁边使用二元运算符？

<span class="gallery-date">{{gallery.date | date:'mediumDate' || "Date Empty"}}</span>

你也尝试:

<span class="gallery-date">{{ gallery.date == 'NULL' ? 'mediumDate' : "gallery.date"}}</span>