如果绑定为空，则为 Angular 默认值

Question

我见过一个类似的问题，并把它带到了一个发球台。角度模板默认值，如果绑定空/未定义（带过滤器）

我的对象如下所示：

{
  "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"
}

我将左侧表达式括在括号中，但对于具有一年null的项目，它不会显示"TBA"。

<span>{{ (getDate(hit.original_release_date) | date:'yyyy') || 'TBA' }}</span>

我

有一种感觉，这是因为我引用了一个函数并且已经使用了一组括号。我该如何解决这个问题...？

任何帮助，不胜感激。提前感谢！

更新：

这是getDate()函数：

$scope.getDate = function(date) {
  return $filter('dateToISO')(date);
};

和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;
  };
})

Answer 1

也实现默认过滤器。

app.filter('default', [function(){
  return function(value, def) {
    return value || def;
  };
}]);

并将其用作：

<span>{{getDate(hit.original_release_date) | date:'yyyy' | default: 'TBA'}}</span>

更新：此外，如果收到undefined或null，您的dateToISO过滤器可能会失败。
检查其输入。

.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;
  };
})

加：

在角度中，您始终必须执行以下操作：

<span ng-if="hit.original_release_date">{{getDate(hit.original_release_date) | date:'yyyy'}}</span>
<span ng-if="!hit.original_release_date">TBA</span>

Answer 2

试试这个：

{{hit.original_release_date ? (hit.original_release date | date:'yyyy') : 'TBA'}}