我有一个模板绑定,它使用 Angular 的日期过滤器显示一个名为“日期”的模型属性,它是一个日期。
<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>
如何在日期过滤器旁边使用二元运算符?
原来我需要做的就是将表达式的左侧括在软括号中:
<span class="gallery-date">{{(gallery.date | date:'mediumDate') || "Various"}}</span>
我做了以下过滤器:
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>
if (angular.isUndefined(defaultValue) || ... )
语句嵌套在现有的语句中,defString
过滤器通过该语句返回字符串“default
”(其他可能稍后会出现)。这使我可以将它用作 <span>{{expected.string | defString}}</span>
并将 default
作为最终的后备级别。
以防万一你想尝试别的东西。这对我有用:
基于具有以下结构的三元运算符:
condition ? value-if-true : value-if-false
结果:
{{gallery.date?(gallery.date | date:'mediumDate'):"Various" }}
如何在日期过滤器旁边使用二元运算符?
<span class="gallery-date">{{gallery.date | date:'mediumDate' || "Date Empty"}}</span>
你也试试:
<span class="gallery-date">{{ gallery.date == 'NULL' ? 'mediumDate' : "gallery.date"}}</span>
我真的很喜欢这个答案,使用 ngBind,您的默认文本可以只存在于元素主体中,然后如果 ngBind 评估为非空/未定义的内容,您的内容将被自动替换,一切都很愉快
angularjs setting default values to display before evaluation
在你的cshtml中,
<tr ng-repeat="value in Results">
<td>{{value.FileReceivedOn | mydate | date : 'dd-MM-yyyy'}} </td>
</tr>
在您的 JS 文件中,可能是 app.js,
在 app.controller 之外,添加以下过滤器。
这里的“mydate”是您为解析日期而调用的函数。这里的“app”是包含 angular.module 的变量
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;
};
});
不定期副业成功案例分享
{{(gallery.date | date:'mediumDate') || "0"}}