Bağlama Boş / Tanımsızsa Angularjs Şablonu Varsayılan Değeri (Filtreli)

Angular'ın tarih filtresini kullanarak bir tarih olan 'tarih' adlı bir model özniteliği görüntüler bir şablon bağlama var.

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

Çok uzak çok iyi. Ancak şu anda, tarih alanında değer yoksa, ciltleme hiçbir şey görüntülemez. Ancak, tarih yoksa 'Çeşitli' dizesini görüntülemek istiyorum.

Ben bir ikili operatör kullanarak temel mantık alabilirsiniz:

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

Ancak ben tarih filtresi ile çalışmak için alınamıyor:

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

Tarih filtresinin yanında ikili işleci nasıl kullanabilirim?

Yapmam gereken tek şey ifadenin sol tarafını yumuşak parantez içinde sarmaktı:

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

Aşağıdaki filtreyi yaptım:

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

        return input;
    }
});

Bu şekilde kullanılacak:

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

Başka bir şey denemek istemeniz durumunda. Benim için işe yarayan buydu:

Aşağıdaki yapıya sahip Üçlü Operatör temel alınmıştır:

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

Sonuç olarak:

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

Tarih filtresinin yanında ikili işleci nasıl kullanabilirim?

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

ayrıca şunu da deneyin:

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

Bu cevabı gerçekten beğendim, ngBind ile varsayılan metniniz sadece öğe gövdesinde yaşayabilir ve sonra ngBind null / undefined olmayan bir şeyi değerlendirirse, içeriğiniz otomatik olarak değiştirilir ve her şey mutlu olur

angularjs, değerlendirmeden önce görüntülenecek varsayılan değerleri ayarlar

Cshtml'nizde,

<tr ng-repeat="value in Results">                
 <td>{{value.FileReceivedOn | mydate | date : 'dd-MM-yyyy'}} </td>
</tr>

JS Dosyanızda, belki app.js,

App.controller'ın dışına aşağıdaki filtreyi ekleyin.

Burada "tarih", tarihi ayrıştırmak için çağırdığınız işlevdir. Burada "app", angular.module dosyasını içeren değişkendir.

app.filter("mydate", function () {
    var re = /\/Date\(([0-9]*)\)\//;
    return function (x) {
        var m = x.match(re);
        if (m) return new Date(parseInt(m[1]));
        else return null;
    };
});