AngularJS中能否忽略ng-repeat列名与对象属性的大小写？

首先明确核心结论：AngularJS 默认严格遵循 JavaScript 对象属性名的大小写敏感性，所以直接在模板里把{{x.name}}改成{{x.Name}}是无法获取到数据的——因为name和Name在JS里是两个完全不同的属性。不过我们有几种可行的方案来实现忽略大小写访问属性的需求：

方案1：预处理数据源，统一属性名大小写 #

最直接的方式是在把数据源绑定到视图之前，先遍历数组，将所有对象的属性名处理为支持多大小写匹配的形式，比如同时保留原属性名的大小写变体，或者统一转为单一大小写。

示例代码（同时生成大小写属性）：

// 原始数据源
var listItem = [{"name":"Test"}, {"name":"Berglunds snabbköp"}, {"name":"Centro comercial Moctezuma"}, {"name":"Ernst Handel"}];

// 预处理：为每个属性添加大小写变体
angular.forEach(listItem, function(item) {
  for (var key in item) {
    var lowerKey = key.toLowerCase();
    var upperKey = key.toUpperCase();
    // 确保不同大小写的键都指向同一个值
    item[lowerKey] = item[key];
    item[upperKey] = item[key];
  }
});

// 绑定到作用域
$scope.records = listItem;

处理完成后，模板里用{{x.name}}、{{x.Name}}甚至{{x.NAME}}都能正确显示数据。

方案2：自定义过滤器，实现大小写不敏感的属性访问 #

如果不想修改原始数据源，可以自定义一个AngularJS过滤器，专门用来根据不区分大小写的属性名获取对应值。

首先在模块中定义过滤器：

angular.module('yourAppModule').filter('caseInsensitiveProp', function() {
  return function(obj, propName) {
    if (!obj || !propName) return '';
    // 将目标属性名转为小写，遍历对象键进行匹配
    var targetProp = propName.toLowerCase();
    for (var key in obj) {
      if (key.toLowerCase() === targetProp) {
        return obj[key];
      }
    }
    return ''; // 找不到对应属性时返回空字符串
  };
});

然后在模板中使用该过滤器：

<select>
  <option ng-repeat="x in records">{{x | caseInsensitiveProp:'Name'}}</option>
</select>

不管你传入的属性名是'Name'、'name'还是'NAME'，过滤器都会匹配到对应的属性值。

补充说明 #

为什么默认不能忽略大小写？因为JavaScript本身的对象属性是严格区分大小写的，AngularJS的数据绑定本质上是直接访问JS对象的属性，所以自然遵循这一规则——x.name和x.Name在JS里指向对象的两个不同属性，而你的数据源里只有name属性，所以x.Name会返回undefined，视图上就显示为空。

内容的提问来源于stack exchange，提问作者Manesh B