javascript 如果 Binding 为 Null，则 Angular 默认值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27490652/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular Default Value if Binding is Null
提问by realph
I've seen a similar question and followed it to a tee. Angular Template Default Value if Binding Null / Undefined (With Filter)
我看到了一个类似的问题，并跟着它到了一个发球台。如果绑定为空/未定义（带过滤器），则角度模板默认值
My object looks like this:
我的对象看起来像这样：
{
"image": {
"icon_url": "http://static.giantbomb.com/uploads/square_avatar/9/93770/2496414-dying-light-2013523175751_8.jpg",
"medium_url": "http://static.giantbomb.com/uploads/scale_medium/9/93770/2496414-dying-light-2013523175751_8.jpg",
"screen_url": "http://static.giantbomb.com/uploads/screen_medium/9/93770/2496414-dying-light-2013523175751_8.jpg",
"small_url": "http://static.giantbomb.com/uploads/scale_small/9/93770/2496414-dying-light-2013523175751_8.jpg",
"super_url": "http://static.giantbomb.com/uploads/scale_large/9/93770/2496414-dying-light-2013523175751_8.jpg",
"thumb_url": "http://static.giantbomb.com/uploads/scale_avatar/9/93770/2496414-dying-light-2013523175751_8.jpg",
"tiny_url": "http://static.giantbomb.com/uploads/square_mini/9/93770/2496414-dying-light-2013523175751_8.jpg"
},
"name": "Dying Light",
"original_game_rating": null,
"original_release_date": null,
"objectID": "346569380"
}
I'm wrapping the left-hand side expression in brackets, but it doesn't display "TBA" for items that have a year of null.
我将左侧表达式括在括号中，但对于年份为null.
<span>{{ (getDate(hit.original_release_date) | date:'yyyy') || 'TBA' }}</span>
I have a feeling, it's because I'm referencing a function and already using a set of parentheses. How can I solve this problem...?
我有一种感觉，这是因为我正在引用一个函数并且已经使用了一组括号。我怎么解决这个问题...？
Any help with this is appreciated. Thanks in advance!
对此的任何帮助表示赞赏。提前致谢！
UPDATE:
更新：
Here's the getDate()function:
这是getDate()函数：
$scope.getDate = function(date) {
return $filter('dateToISO')(date);
};
And the dateToISOfilter:
和dateToISO过滤器：
.filter('dateToISO', function() {
return function(input) {
var dateTime = input.split(" ");
var date = dateTime[0];
var datePartials = date.split("-");
var time = dateTime[1];
var timePartials = time.split(":");
var formattedDate = new Date();
formattedDate.setFullYear(datePartials[0]);
formattedDate.setMonth(datePartials[1]-1);
formattedDate.setDate(datePartials[2]);
formattedDate.setHours(timePartials[0]);
formattedDate.setMinutes(timePartials[1]);
return formattedDate;
};
})
回答by vp_arth
Implement default filter also.
也实现默认过滤器。
app.filter('default', [function(){
return function(value, def) {
return value || def;
};
}]);
And use it as:
并将其用作：
<span>{{getDate(hit.original_release_date) | date:'yyyy' | default: 'TBA'}}</span>
Update:also your dateToISOfilter may fails, if undefinedor nullbeen received.
Check its input.
更新：dateToISO如果undefined或null已收到，
您的过滤器也可能会失败。
检查其输入。
.filter('dateToISO', function() {
return function(input) {
if (!input || !input.match(/^\d{2}-\d{2}-\d{4} \d{2}\:\d{2}\:\d{2}$/)) return;
var dateTime = input.split(" ");
var date = dateTime[0];
var datePartials = date.split("-");
var time = dateTime[1];
var timePartials = time.split(":");
var formattedDate = new Date();
formattedDate.setFullYear(datePartials[0]);
formattedDate.setMonth(datePartials[1]-1);
formattedDate.setDate(datePartials[2]);
formattedDate.setHours(timePartials[0]);
formattedDate.setMinutes(timePartials[1]);
return formattedDate;
};
})
Add:
添加：
And in angular, you always have to do:
在 angular 中，您始终必须执行以下操作：
<span ng-if="hit.original_release_date">{{getDate(hit.original_release_date) | date:'yyyy'}}</span>
<span ng-if="!hit.original_release_date">TBA</span>
回答by Tyler Roth
Try this:
试试这个：
{{hit.original_release_date ? (hit.original_release date | date:'yyyy') : 'TBA'}}
