AngularJS中ng-repeat值为null时的显示处理咨询

我来帮你解决这两个ng-repeat里的绑定值显示问题，直接上实用的解决方案：

问题1：绑定值为null时显示空字符串 #

你可以用严格相等判断的三元表达式来精准处理，只在值为null时显示空字符串，其他情况（包括0、空字符串等）都显示原数值：

<div ng-repeat="item in items">
  {{item.daysSinceMaintenanceUpdate === null ? '' : item.daysSinceMaintenanceUpdate}}
</div>

原理很简单：通过=== null严格匹配null值，避免把其他假值（比如0、''）误判成需要替换的情况。

问题2：仅null时显示'--'，0时保持显示0 #

你之前用的{{x.daysSinceMaintenanceUpdate || '--'}}之所以会把0也替换成'--'，是因为在JavaScript里0属于"假值"，会触发||的右侧逻辑。解决的核心还是精准判断null，同样用三元表达式：

<div ng-repeat="item in items">
  {{item.daysSinceMaintenanceUpdate === null ? '--' : item.daysSinceMaintenanceUpdate}}
</div>

这样只有当值严格等于null时才显示'--'，0、空字符串、undefined等其他值都会正常显示原内容。

进阶方案：自定义过滤器（复用性更强） #

如果你的项目里很多地方都需要这种处理，建议自定义一个AngularJS过滤器，让代码更简洁易维护：

首先在你的模块里注册过滤器：

angular.module('yourAppName').filter('nullReplacer', function() {
  return function(input, replacement) {
    // 严格判断是否为null，是则返回替换值，否则返回原输入
    return input === null ? replacement : input;
  };
});

然后在模板里直接使用：

• 对应问题1（null显示空字符串）：

<div ng-repeat="item in items">
  {{item.daysSinceMaintenanceUpdate | nullReplacer:''}}
</div>

• 对应问题2（null显示'--'）：

<div ng-repeat="item in items">
  {{item.daysSinceMaintenanceUpdate | nullReplacer:'--'}}
</div>

这个过滤器可以灵活传入不同的替换值，适配各种场景，非常适合多页面复用的情况。

内容的提问来源于stack exchange，提问作者Amsaveni Natarajan