Angular Значение по умолчанию для шаблона, если привязка Null/Undefined (с фильтром)

У меня есть привязка к шаблону, которая отображает атрибут модели с именем date, который является датой, используя фильтр даты Angular.

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

Пока все хорошо. Однако на данный момент, если в поле даты нет значения, привязка ничего не отображает. Тем не менее, я бы хотел, чтобы он отображал строку "Разное", если нет даты.

Я могу получить основную логику с помощью двоичного оператора:

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

Однако я не могу заставить его работать с фильтром даты:

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

Как использовать двоичный оператор вместе с фильтром даты?

Ответ 1

Оказывается, все, что мне нужно было сделать, это обернуть левую часть выражения в мягкие скобки:

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

Ответ 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>

Ответ 3

На всякий случай вы хотите попробовать что-то еще. Это то, что сработало для меня:

На основе тернарного оператора, который имеет следующую структуру:

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

В результате:

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

Ответ 4

Мне действительно понравился этот ответ, с ngBind, ваш текст по умолчанию может просто жить в теле элемента, а затем, если ngBind оценивает что-то ненулевое / undefined, ваш контент автоматически заменяется, а все счастливы

angularjs устанавливает значения по умолчанию для отображения перед оценкой