AngularJS中filter过滤器提取对象值返回undefined问题求助

你的代码返回undefined是因为AngularJS内置的filter过滤器的匹配逻辑和你的数据结构不兼容：

• 你的states数组里每个对象的属性名都是不同的州名（比如"ORISSA"、"KARNATAKA"），而非统一的字段（比如name）
• 你用{key: str}作为过滤条件，相当于让过滤器去找**属性名为key且值等于str**的对象，但你的数据里根本没有key这个属性，自然找不到匹配项，最终返回undefined

我给你三种可行的处理方式，你可以根据场景选择：

1. 自定义专用过滤器（推荐，复用性强） #

写一个专门用来根据键查找值的过滤器，后续其他业务场景也能直接复用：

// 在你的AngularJS模块中注册过滤器
angular.module('yourAppName').filter('findByKey', function() {
  return function(items, targetKey) {
    // 遍历数组中的每个对象
    for (let item of items) {
      // 检查当前对象是否包含目标键
      if (item.hasOwnProperty(targetKey)) {
        return item[targetKey]; // 找到后直接返回对应值
      }
    }
    return null; // 未找到时返回null，也可以改成你需要的默认值比如''
  };
});

在控制器中调用：

var abbr = $filter('findByKey')(states, str);
// 当str为"ORISSA"时，abbr会得到"OR"

2. 原生JS直接处理（适合临时场景） #

如果不想新增过滤器，直接在控制器里用原生JS遍历查找也能解决问题：

var abbr;
// 遍历数组查找匹配项
for (let item of states) {
  // 获取当前对象的唯一键（因为你的每个对象只有一个键值对）
  const currentKey = Object.keys(item)[0];
  if (currentKey === str) {
    abbr = item[currentKey];
    break; // 找到后跳出循环，避免无效遍历
  }
}
// 或者用ES6+的简写方式
var abbr = states.find(item => Object.keys(item)[0] === str)?.[str];

3. 调整数据结构（最规范，长期维护更方便） #

如果可以修改states的格式，把它改成每个对象都有统一字段的结构，这样用内置filter会非常顺手：

// 调整后的数组，每个对象都包含name（州名）和abbr（缩写）字段
var states = [
  {"name":"HIMACHAL PRADESH", "abbr":"HP"},
  {"name":"JAMMU AND KASHMIR", "abbr":"JK"},
  {"name":"JHARKHAND", "abbr":"JH"},
  {"name":"KARNATAKA", "abbr":"KA"},
  {"name":"KERALA", "abbr":"KL"},
  {"name":"MADHYA PRADESH", "abbr":"MP"},
  {"name":"MAHARASHTRA", "abbr":"MH"},
  {"name":"ORISSA", "abbr":"OR"}
];
var str = "ORISSA";
// 用内置filter精确匹配，取第一个结果的abbr字段
var matchedState = $filter('filter')(states, {name: str}, true)[0];
var abbr = matchedState ? matchedState.abbr : undefined;

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